你会用es6，倒是用啊

一、关于取值的吐槽

　　取值在程序中非常常见，比如从对象obj中取值

const obj={
  a:1,
  b:2,  
c:3
}
吐槽：
const a= obj.a
const b=obj.b
const c=obj.c
或者
const f=obj.a+obj.b;
const g=obj.c+obj.e;
改进：
const {a,b,c,d,e}=obj;
const f=a+b;
const g=c+e;

如果向创建的变量名和对象属性不一致，可以这样写
const {a:a1}=obj;
console.log(a1)

补充

es6的解构赋值虽然好用。但是要注意解构的对象不能为undefined、null。否则会报错，因此需要给解构的对象一个默认值。

const {a,b,c,d}=obj||{}

二、关于合并数组的吐槽

比如合并两个数组，合并两个对象

const a=[1,34,3,5];const b=[1,5,6];const c=a.concat(b)

const obj1={a:1};const obj2={b:2};

const obj3=object.assign({},obj1,obj2);

吐槽：es6扩展运算符是不是忘了，还有数组的合并不考虑去重吗？

改进：

const a=[1,2,3,4];

const b=[1,5,6];

const c=[..new Set([...a,...b])];

三、关于if中判断条件的吐槽

if(type==a||type==1||type==6){...}

吐槽：es6中数组实例方法includes会不会用呢？

改进：const condition=[1,2,3,4,5,6];

if（condition.includes(type)）{........}

四、关于列表搜索吐槽

const a = [1,2,3,4,5];
const result = a.find(
item =>{
return item === 3
}
);console.log(result)
// 3,返回满足条件的对应元素find()

const a = [1,2,3,4,5];
const result = a.filter(
item =>{
return item === 3

}

);console.log(result)
// [3],返回一个数组，数组中的值为满足条件的对应元素

五、关于扁平化数组的需求

一个部门json数据中，属性名是部门的id,属性值是部门成员id数组集合，现要把部门的成员id都提取到一个数组集合中。

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)];console.log(member)
//(10) [1, 2, 3, 5, 8, 12, 14, 79, 64, 105]

 吐槽获取对象的全部属性值好要遍历吗？Object.values忘记了吗？还有涉及到数组的扁平化处理，为啥不用提供flat方法呢，还好这个数组的深度只有2维，要是遇到4维、5维的深度，是不是要循环嵌套来扁平化？

const deps = {
    '采购部':[1,2,3],
    '人事部':[5,8,12],
    '行政部':[5,14,79],
    '运输部':[3,64,105],
}
let member=Object.values(deps).flat(Infinity);
//es2019中的新功能flat(),flat()方法会递归到指定深度将所有子数组连接，并返回一个新数组。flat函数接收一个参数，参数值为要展开数组的维度，infinity展开所有嵌套数组
//arr.flat()方法可以移除数组中的空项。

六、关于获取对象属性值的吐槽

const name=obj&&obj.name;

改进：es6中的可选链操作符会使用吗？

const name=obj?.name;

七、关于添加对象属性的吐槽

当给对象加属性时，如果属性时动态变化的，该怎么处理。

let obj={};let index=1;let key = `topic${index}`;

obj[key]='话题内容'；

let obj={};
let index1;
obj[`topic${index}`]='话题内容'

八、关于输入框非空的判断

在处理输入框相关业务时，往往会判断输入框为输入值的场景

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

吐槽：es6中空寂合并运算符了解过吗

if((value??'') !== ''){
//...
}

九、关于异步函数的吐槽

const fn1 = () =>{
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(1);
    }, 300);
  });
}
const fn2 = () =>{
  return new Promise((resolve, reject) => {
    setTimeout(() => {
      resolve(2);
    }, 600);
  });
}
const fn = () =>{
   fn1().then(res1 =>{
      console.log(res1);// 1
      fn2().then(res2 =>{
        console.log(res2)
      })
   })
}

吐槽：如果这样调用异步函数，不怕形成地域回调啊！

const fn = async () =>{
  const res1 = await fn1();
  const res2 = await fn2();
  console.log(res1);// 1
  console.log(res2);// 2
}
//但是要做并发请求时，还是要用到paromise.all().
const fn=()=>{
 promise.all([fn1(),fn2()]).then(res=>{
     console.log(res);
})
}
//如果并发请求时，只要其中一个异步函数处理完成，就返回结果，要用到Promise.race()。