几个es6的新增的操作符和方法

2023-07-13  本文已影响0人  执着于98斤的it女

1、es6 includes方法

写判断时,经常会遇到多个判断条件:

if(type == 1 ||type == 2 ||type == 3 || type == 4 ){
//...
}

可以改成这样

const condition = [1,2,3,4];
if( condition.includes(type) ){
        //...
}

2、可选链操作符?.

之前是这样

const name = obj && obj.name;

现在可以改成这样

const name = obj?.name;
//   ?. 运算符
let data = {
    arr: [0,0,0]
}
// 旧的写法 需加一个判断
if(data.arr) {
    data.arr.forEach(v=>{})
}
// 旧的写法 二
(data.arr || []).forEach(v=>{})
 
// 新语法
data.arr?.forEach(v=>{})

3、空值合并运算符??

之前是这样

if(value !== null && value !== undefined && value !== ''){
  //...
}

现在可以这样

if(value??'' !== ''){
  //...
} 
let b = 0 ?? 100; // b的值为0
let b = null ?? 100; // b的值为100
let b = false ?? 100; // b的值为 false

4、 || 运算符

// || 运算符
let a = '' || 100; // a的值为 100
let a = 0 || 100; // a的值为 100
let a = false || 100; // a的值为 100
let a = undefined || 100; // a的值为 100
let a = null || 100; // a的值为 100
let a = 10 || 100; // a的值为 10

5、扁平化数组

之前是这样写

const deps = {
        '采购部':[1,2,3],
        '人事部':[5,8,12],
        '行政部':[5,14,79],
        '运输部':[3,64,105],
}
let member = [];
for (let item in deps){
        const value = deps[item];
        if(Array.isArray(value)){
            member = [...member,...value]
        }
}
member = [...new Set(member)]

现在可以这样

const deps = {
        '采购部':[1,2,3],
        '人事部':[5,8,12],
        '行政部':[5,14,79],
        '运输部':[3,64,105],
}
let member = Object.values(deps).flat(Infinity);
上一篇 下一篇

猜你喜欢

热点阅读