飞利浦·斯塔克|学会这些JS小技巧，工作效率直接翻倍！飞利浦·斯塔克

文章图片

文章图片

作为初入职场的前端人，你是不是常常感到很疑惑。为什么同样的工作量，别人每天都能准时下班，而你却天天都要加班。同样都是使用JS ，难道他们打字的速度比你快？当然不是啦。那是因为别人不仅会熟练运用JS ，更会一些能节省工作时间，提升工作效率的JS小技巧。

野蛮人与文明人的区别是文明人会使用工具，而聪明人与普通人的区别则在于他们会运用头脑和技巧。所以，想要每天都能够准时下班，并且留出摸鱼的时间，一味地埋头苦干是没有用的，提升工作效率才是关键。
想要提升工作效率，并且让你的代码看起来更加专业，下面这些简单且实用的JS小技巧你一定要掌握好~
一、滚动到页面顶部

/*niemvuilaptrinh.com*/
const scrollToTop = () => window.scrollTo(0 0);
scrollToTop();

二、创建“返回”按钮

<button onclick=\"history.back()\">
返回
</button>

只需用 history.back() 就可以创建一个“返回”按钮。

三、数值分隔符
在编写代码时遇到很长一段数字，为了方便阅读，可以利用下划线作为数值分隔符。但是需要注意，分隔符不能出现在首位0后面和数字的末尾。

const largeNumber = 4_000_000;
console.log(largeNumber); // 4000000

四、过滤唯一值
Set类型是在ES6中新增的，类似于数组，但成员的值是唯一的。结合扩展运算符（...）可以创建一个新的数组，来达到过滤原数组重复值的功能。但是需要注意的是这只适用于undefined ，null ，boolean ，string ，number等数值类型，若数值中包含object ，function ，array ，则不适用。

const array = [13 3 2 4 5 66
;
const uniqueArray = [...new Set(array)
;
console.log(uniqueArray); // [1 2 3 456

五、转换Boolean型
常规的boolean型值只有“true”和 “false” ，但在JS中可以把其他值认为是“truthy”或者是“falsy”的。除0 ， “” ， null ， undefined ， NaN 和 false之外其他值都可以认为是‘truthy’的。这样就可以通过负运算符！将一系列变量转换成“boolean”型。

const isTrue = !0;
const isFalse = !1;
const alsoFalse = !!0;
console.log(isTrue); // Result: true
console.log(typeof true);// Result: \"boolean\"

六、过滤数值中的虚值
像 “0 undefined null false \"\" ''”这样的虚值，我们可以通过下面的方法来过滤掉：

const array = [4 2 0 5null 0
;
array.filter(Boolean);
// 输出
(3) [4 2 5

七、获取数组中的平均值
求数组中的平均值需要先获取到所有的参数，然后将这些参数转化为数组，再把数组中的第一项和最后一项去掉，最后用数组中剩余的数据求和并取平均值即可。代码如下：

function sumAverage() {