JavaScript 实用黑科技高效率开发

古城微笑少年丶 2022-02-01 12:27 205阅读 0赞

# 第一式.  !! #

!! 操作符：!!variable  。  
!! 可以将变量转换为布尔值。  
!! 可以把任何类型的值转换为布尔值，并且只有当这个变量的值为 0 / null /  "" / NaN /  undefined 的时候才会返回 false，其他情况都返回 true。

!!'' 
    // false
    !!' '
    // true
    !!0
    // false
    !!null
    // false
    !!undefined
    // false
    !!NaN
    // false
    !!123
    // true
    !![]
    // true

# 第二式.  + #

它只能作用于字符串数值，否则就会返回 NaN（不是数字）。  
例子：

function toNumber(strNumber) {
        return +strNumber;
    }
    console.log(toNumber("1234")); 
    // 1234
    console.log(toNumber("abc"));
     // NaN

并且此方法也可作用于 Date 函数，这是它将返回时间戳：

console.log(+new Date()) 
    // 1461288164385

# 第三式. if (条件) #

if (token) {
        getUser();
    }

可以通过使用 && 操作符组合两个变量来缩短它。

比如前面这段代码可以缩短为：

token && getUser();

# 第四式. 短路表达式 || #

如果第一个参数返回 false，第二个值将被作为默认值。用来设置默认参数。

function getUser(token) {
        var token = token || "XXXXXXXXXX";
        console.log('token',token)
        // 用 token 来异步请求数据
        // .......
    }
    getUser(666666);
    // 666666
    getUser();
    // XXXXXXXXXX

# 第五式. 获取数组中最后的元素 #

大多数人的做法：

var arr = [123, 456, 789];
    var len = arr.length;
    var end = arr[len-1]
    console.log('end:', end)
    // 'end:' 789

优化方法：

var array = [1, 2, 3, 4, 5, 6];
    console.log( array.slice(-1) ); // [6]
    console.log( array.slice(-1)[0] ); // 6
    console.log( array.slice(-2) ); // [5,6]
    console.log( array.slice(-3) ); // [4,5,6]

# 第六式. 打乱数组元素的顺序 #

不适用 Lodash 等这些库打乱数组元素顺序，你可以使用这个技巧：

var list = [1,2,3];
    console.log( list.sort(function() { Math.random() - 0.5 }) ); // [2,1,3]

# 第七式. 伪数组转换为真数组 #

var elements = document.querySelectorAll("p"); 
     // NodeList 节点列表对象。但这个对象并不具有数组的全部方法，如 sort(), reduce(), map(), 
     filter()
    var arrayElements = [].slice.call( elements ); 
    // 现在 NodeList 是一个数组
    var arrayElements = Array.from( elements ); 
    // 这是另一种转换 NodeList 到 Array  的方法

# 第八式. 截断数组 #

比如，当数组中有 10 个元素，而你只想获取其中前 5 个的话，你可以截断数组，通过设置 array.length = 5 使其更小。

var array = [1,2,3,4,5,6];
    console.log( array.length ); 
    // 6
    array.length = 3;
    console.log( array.length );
     // 3
    console.log( array ); 
    // [1,2,3]

# 第九式. 合并数组 #

一般人合并两个数组的话，通常会使用 Array.concat()。

var array1 = [1,2,3];
    var array2 = [4,5,6];
    console.log(array1.concat(array2)); // [1,2,3,4,5,6];

然而，**这个函数并不适用于合并大的数组，因为它需要创建一个新的数组，而这会消耗很多内存**。

这时，你可以使用 Array.push.apply( arr1, arr2 ) 来代替创建新的数组，它可以把第二个数组合并到第一个中，从而较少内存消耗：

var array1 = [1,2,3];
    var array2 = [4,5,6];
    console.log( array1.push.apply(array1, array2) );  // [1,2,3,4,5,6];

# 最后 #

此篇博客是楼主无意之中浏览所得，觉得工作中经常可以用来写更高效率的代码，所以copy过来供自己和大家参考。

### 原文地址：[https://mp.weixin.qq.com/s/wzzlOrbi-M05UAUvtAqetA][https_mp.weixin.qq.com_s_wzzlOrbi-M05UAUvtAqetA] ###

[https_mp.weixin.qq.com_s_wzzlOrbi-M05UAUvtAqetA]: https://mp.weixin.qq.com/s/wzzlOrbi-M05UAUvtAqetA