Javascript的5个小技巧

删除Array中重复的值

利用Set特性。

const array = [1,2,2,3,3,3,4,4,4,4,5];
const unique = [... new Set(array)];

模板字符串

使用反引号 (` `) 来代替普通字符串中的用双引号和单引号。

const str = `Hello ${expression}!`;

const num1 = "1";
const num2 = "2";
console.log(`${num1}${num2}`); // 12

更多资讯

类转换

使用!!转换成Boolean。

const obj = { field1: "value" };
const bin = 0;

console.log( !!obj ); // true
console.log( !!bin ); // false

使用+转换成Number

const num1 = "1";
const num2 = "2";

console.log( (+num1) + (+num2) ); // 3

空值合并运算符

当需要给空值一个默认值，可以使用??。
那么为何不是||呢？因为||无法区分 false、0、空字符串 "" 和 null/undefined。

const field1 = "value";
const field2 = false;
const field3 = 0;
const field4 = null;

console.log( field1 || "default" ); // value
console.log( field2 || "default" ); // default
console.log( field3 || "default" ); // default
console.log( field4 || "default" ); // default

console.log( field1 ?? "default" ); // value
console.log( fiedl2 ?? "default" ); // false
console.log( field3 ?? "default" ); // 0
console.log( field4 ?? "default" ); // default

高级用法可以参阅这里

可选链 ?.

使用?.简去使用if else

const obj = {
   sayHi: ()=>console.log("Hi")
}；

const empty = { };
const nullValue = null;

obj.sayHi(); // Hi
empty.sayHi(); // "'empty' undefined error"
nullValue.sayHi(); // "'nullValue' undefined error"

empty?.sayHi(); // "no error"
// equal to 
if( empty && empty.sayHi ) {
  empty.sayHi();
}

nullValue?.sayHi(); // "no error"
// equal to 
if( nullValue && nullValue.sayHi ) nullValue.sayHi();