前端 ES6 使用技巧

// if条件判断
if(
    type == 1 ||
    type == 2 ||
    type == 3 ||
    type == 4 ||
){
   //...
}

//改进  ES6中数组实例方法includes
const condition = [1,2,3,4];

if( condition.includes(type) ){
   //...
}

// 前端搜索 过滤
const a = [1,2,3,4,5];
const result = a.filter( 
  item =>{
    return item === 3
  }
)

//改进 ES6  find方法中找到符合条件的项，就不会继续遍历数组
const a = [1,2,3,4,5];
const result = a.find( 
  item =>{
    return item === 3
  }
)

// 获取对象属性值
const name = obj && obj.name;

//改进  ES6中的可选链操作符
const name = obj?.name;

//动态添加对象属性
let obj = {};
let index = 1;
let key = `topic${index}`;
obj[key] = '内容';

//改进  ES6中的对象属性名是可以用表达式
let obj = {};
let index = 1;
obj[`topic${index}`] = '内容';

// 输入框非空判断
if(value !== null && value !== undefined && value !== ''){
    //...
}

//改进  ES6中新出的空值合并运算符
if(value??'' !== ''){
  //...
}

//数组去重
const numbers = [2, 3, 4, 4, 2];

console.log([...new Set(numbers)]); // [2, 3, 4]