会ES6，用ES6，不再让leader吐槽

文中代码摘抄自：掘金大佬红尘炼心的文章你会用ES6，那倒是用啊！

  本文是阅读你会用ES6，那倒是用啊！。有感而写，想看的朋友可以点击链接跳转阅读。
  故事是这样开始的，2021年10月12号，看技术交流群里有人推送了一篇博文：你会用ES6，那倒是用啊！。当时没事点击去看了一下，看leader的吐槽感觉就是在说原来在老东家的我。当时代码根本不注意风格和规范，就是一顿乱怼，可以说是在“屎堆”上继续堆“屎”。由于没有规范的代码要求，再加上平时自己写不太注重代码风格和规范，写的很乱，基本就是能实现功能就行。
  9月1号入职新东家后，发现这边有很多语法规范和要求，刚开始写真的不舒服，慢慢的开始上手了，也发现了很多好处。
  其实在工作中有leader来check代码是件好事，这样技术水平会有显著的提高，在工作中学习，在学习中工作。
  掘金文章：你会用ES6，那倒是用啊！确实是一篇爽文，里面列举到的很多都是我们会用，但是却忽视的地方，希望大家可以看一下。
  下面说一下我在项目中遇到的一些ES6的实际应用：

• 解构赋值
  • 场景：后端返回的数据data是一个对象，我只需要其中的一项或者几项，使用解构赋值

  //后端返回的数据
  const obj = {
      a:1,
      b:2,
      c:3,
      d:4,
      e:5,
  }
  //我只需要其中的几项，去做别的操作  
  const {a,c,d,e} = obj;
  const f = a + d;
  const g = c + e;
  

  • 注意：解构的对象不能为undefined、null
• 数组合并
  • 场景1：[1,2,3],[1,5,6]合并为[1,2,3,1,5,6]

  const a = [1,2,3];
  const b = [1,5,6];
  const c = [...new Set([...a,...b])];//[1,2,3,5,6]
  

  • 场景2

  const obj1 = {
    a:1,
  }
  const obj2 = {
    b:1,
  }
  const obj = {...obj1,...obj2};//{a:1,b:1}
  

• if中判断条件,使用includes
  • 场景

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

  • 使用

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

• 获取对象属性值,ES6可选链操作符
  • 场景：

  const name = obj && obj.name;
  

  • 使用

  const name = obj?.name;
  

  目前我在项目中使用到的就只有这些，ES6确实可以简化语法，提高代码质量和阅读性，但有时可能会让可读性下降，有兴趣就去读一读你会用ES6，那倒是用啊！吧。
  下篇文章我会出一篇关于新东家对语法规范方面要求的文章，敬请期待。