你不知道的js奇淫技巧

在js中, 有一些常用的奇淫技巧, 可以让你少写很多代码, 但是你不一定见过这种写法, 下面就记录几个js的奇淫技巧, 防止自己在以后看见的时候懵逼

数组去重

var arr = [1, 2, 2, 3, 4, 5, 6, 6, 7, 7, 8, 4, 2, 1];
var uniqueArr = [...new Set(arr)];
console.log(uniqueArr); // [1, 2, 3, 4, 5, 6, 7, 8]

打乱数组元素

var arr = [1, 2, 3, 4, 5, 6, 7, 8, 9];
console.log(arr.sort(function() {
  return Math.random() - 0.5;
})); // [4, 8, 2, 9, 1, 3, 6, 5, 7]

碾平二维数组

var entries = [1, [2, 5], [6, 7], 9];
var flatEntries = [].concat(...entries); // [1, 2, 5, 6, 7, 9]

数字转字符串

var convertedNumber = 1 + "";
console.log(typeof convertedNumber, convertedNumber); // string 5

字符串转数字

convertedString = "123";
console.log(+convertedString); // 123

// 注意 只有能转成数字的字符串前面加"+"才能转成字符串, 否则返回NaN
string = "hello";
console.log(+string); // NaN

全部替换

var example = "potato potato";
console.log(example.replace(/pot/, "tom")); // "tomato potato"
console.log(example.replace(/pot/g, "tom")); // "tomato tomato"

使用短路运算符

if (available) {
  addToCart();
}

// 通过简单地使用变量和函数来缩短它

available && addToCart();

动态属性名

const dynamic = 'flavour';
var item = {
  name: 'Coke',
  [dynamic]: 'Cherry'
}
console.log(item); // { name: "Coke", flavour: "Cherry" }