有意思的js编码小技巧

1.取整，位运算更快

 Math.floor(4.9) === 4  //true
 ~~4.9 === 4  //true

2.三元运算符 ? : 还用于简化函数的调用。

function x() { console.log('x') };
 function y() { console.log('y') };

 let z = 3;
 简化前：
 if (z == 3) {
    x();
 } else {
    y();
 }
  简化后：
 (z==3?x:y)();    //x

3.平时我们使用最多的就是数组的.map方法，其实还有一个方法也能达到一样的目的，用法比较冷门，所以我们总是忽视，那就是 Array.from(用于抽出数组对象中的id值)

 var friends = [
   {name: 'John',age: 22},
   {name: 'Peter',age: 23},
   {name: 'Mark',age: 24},
   {name: 'Maria',age: 22},
   {name: 'Monica',age: 21},
   {name: 'Martha',age: 19}]
 var friendsNames = Array.from(friends, ({name}) => name);
 console.log(friendsNames);

4.数组转换成对象 有时候需要将数组转换成对象的形式，使用.map()一类的迭代方法能达到目的。 这里还有个更快的方法，前提是你正好希望对象的key就是数组的索引

var fruits = ["banana", "apple", "orange", "watermelon"];
 var fruitsObj = { ...fruits };
 console.log(fruitsObj);

5.合并数组.concat()但是今天的主角是ES6的展开运算符(…)

 var fruits = [{"apple": "apple"},{"banana": "banana"},{ "orange": "orange"}];3
 var meat = ["poultry", "beef", "fish"];
 var food = [...fruits, ...meat];
 console.log(food);

6.两个数组的交集(一般的做法是做条件判断，定义一个变量接收) 下面展示的是ES6的简洁写法

 var numOne = [0, 2, 4, 6, 8, 8];
 var numTwo = [1, 2, 3, 4, 5, 6];
 var duplicatedValues = [...new Set(numOne)].filter(item => numTwo.includes(item));
 console.log(duplicatedValues);

7.转换Number类型

 let int = "15";
 int = +int;
 console.log(int); // Result: 15
 console.log(typeof int); Result: "number"

在某些上下文中，+将被解释为连接操作符，而不是加法操作符。

当这种情况发生时(您希望返回一个整数，而不是浮点数)，您可以使用两个波浪号:~~。(需要注意为英文格式)

一个波浪号~，被称为“按位不运算符”，等价于 - n - 1。所以~15 = -16. 使用两个~~可以有效的否定运算。

这是因为 - (- n - 1) - 1 = n + 1 - 1 = n。也就是说~-16 = 15

 const int = ~~"15"

 console.log(int); // Result: 15
 console.log(typeof int); Result: "number"

8.快速Float转Integer

我们平时可以使用Math.floor(), Math.ceil()和Math.round()将float类型转换成integer类型。

但是还有一种更快的方法可以使用|(位或运算符)将浮点数截断为整数。

 console.log(23.9 | 0);  // Result: 23
 console.log(-23.9 | 0); // Result: -23

9.获取数组中的最后的元素(一贯写法是arr.length[arr.length-1])

 let array = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
 console.log(array.slice(-1)); // Result: [9]
 console.log(array.slice(-2)); // Result: [8, 9]
 console.log(array.slice(-3)); // Result: [7, 8, 9]

10.数组扁平化

数组扁平化是指将一个多维数组变为一个平铺数组 const arr = [1, [2, [3, [4, 5]]], 6]; 使用flat()

const res1 = arr.flat(Infinity);

11.短路求值

let one = 1, two = 2, three = 3;
console.log(one && two && three); // Result: 3

12.过滤空值

 const arr = [undefined, null, "", 0, false, NaN, 1, 2].filter(Boolean)  // arr => [1, 2]