es6用过哪些,使用es6
本文分享给大家一位领导关于ES6的十点，并相应补充一些相关知识，希望对你有所帮助！
“可以用ES6，那有用！”:这是一个领导者在代码评审会议上对团队成员的“咆哮”。原因是在代码评审中很多地方还在用ES5。并不是说不能用ES5写，会有bug，只是造成代码更多，可读性更差。
碰巧的是，这位领导在代码方面很整洁。面对有3~5年经验的成员，他还写这种水平的代码，他极度不满，不断吐槽代码。不过我觉得从他的演讲中我收获很大，所以把leader的演讲录了下来，分享给朋友们。感觉收获了一些好评，有错误或者写的更好。非常欢迎在评论里留言。【相关推荐：javascript学习教程】
ps：ES5之后的JS语法统称ES6！！！
一、关于取值的吐槽
取值在程序中很常见，比如从对象obj中取值。
const obj={
答：1，
乙：2，
c:3，
d:4，
e:5，
}吐槽:
const a=obj.a
const b=obj.b
const c=obj.c
const d=obj.d
const e=obj.e或者
const f=obj . a obj . d；
const g=obj . c obj . e；吐槽：“不会用ES6的解构赋值来取值吗？5行代码加1行代码。闻起来不香吗？直接使用对象名和属性名来获取值。对象名短或长怎么办？在代码中的任何地方都使用该对象名。
改进:
const {a，b，c，d，e }=obj
const f=a d；
const g=c e；反驳
不是ES6的解构赋值，而是服务器返回的数据对象中的属性名不是我想要的。所以，我们必须重新创建一个遍历赋值。
吐槽
看来你对ES6解构作业的理解还不够透彻。如果要创建的变量名与对象的属性名不一致，可以这样写：
const { a:a1 }=obj；
console . log(a1)；//1补充
虽然ES6的解构赋值很好用。但是，应该注意，被解构的对象不能是未定义的或空的。否则，将会报告一个错误，因此被解构的对象应该被赋予一个默认值。
const {a，b，c，d，e }=obj { }二、关于合并数据的吐槽
比如合并两个数组，合并两个对象。
const a=[1，2，3]；
const b=[1，5，6]；
const c=a . concat(b)；//[1,2,3,1,5,6]
const obj1={
答：1，
}
const obj2={
乙：1，
}
const obj=Object.assign({}，obj1，obj 2)；//{a:1，b:1}吐槽
是不是忘了ES6的扩展运算符，合并阵列不考虑重复数据删除？
改进
const a=[1，2，3]；
const b=[1，5，6]；
常数c=[.新集合([.一，b])]；//[1,2,3,5,6]
const obj1={
答：1，
}
const obj2={
乙：1，
}
const obj={.obj1，obj 2 }；//{a:1，b:1}三、关于拼接字符串的吐槽
Const name=晓明；
const得分=59；
假设结果=“”；
如果(60分){
结果=` { name }通过了考试`；
}否则{
result=` { name }考试不及格`；
}吐槽
你最好不要像这样使用ES6字符串模板。你不知道用$ {}能做什么。在$ {}中，可以放置任意的JavaScript表达式，执行操作，引用对象属性。
改进
Const name=晓明；
const得分=59；
const result=`${name}${score 60？考试成绩合格:考试成绩 } 不合格；四、关于if中判断条件的吐槽
如果(
type==1
type==2
type==3
type==4
){
//.
}吐槽
是否会使用ES6中包含的数组实例方法？
改进
const条件=[1，2，3，4]；
if( condition.includes(type) ){
//.
}五、关于列表搜索的吐槽
在项目中，一些非分页列表的搜索功能由前端实现，搜索一般分为精确搜索和模糊搜索。搜索也叫过滤，一般用filter来实现。
const a=[1，2，3，4，5]；
const结果=a.filter(
item={
返回项目===3
}
)吐槽
如果是精确搜索，你不会在ES6里用find吗？性能优化，要知道，如果在find方法中找到一个合格的项，就不会继续遍历数组了。
改进
const a=[1，2，3，4，5]；
const result=a.find(
item={
返回项目===3
}
)六、关于扁平化数组的吐槽
在部门JSON数据中，属性名是部门id，属性值是部门成员id的数组集合。现在，所有部门的所有成员id都应该提取到一个数组集中。
const deps={
采购部:[1，2，3]，
人事部，[5，8，12]，
行政部:[1979年5月14日]，
交通运输部:[3，64，105]，
}
let member=[]；
对于(让项目在deps中){
常量值=deps[item]；
if(Array.isArray(value)){
成员=[.成员，价值]
}
}
成员=[.新设置(成员)]吐槽
还需要遍历来获取对象的所有属性值吗？你忘了Object.values吗？还有就是数组的扁平化，那为什么不用ES6提供的扁平化方法呢？好在这个数组的深度最多只有2维，还得满足4维和5维的深度数组。一定要循环嵌套循环才能展平吗？
改进
const deps={
采购部:[1，2，3]，
人事部，[5，8，12]，
行政部:[1979年5月14日]，
交通运输部:[3，64，105]，
}
let member=Object.values(deps)。平坦(无穷大)；用Infinity作为flat的参数，不需要知道展平后数组的维数。
补充
平面方法不支持IE浏览器。
七、关于获取对象属性值的吐槽
const name=obj obj.name吐槽
是否会使用ES6中可选的chain运算符？
改进
const name=obj？姓名；八、关于添加对象属性的吐槽
给对象添加属性时，属性名动态变化怎么办？
设obj={ }；
设index=1；
let key=`topic $ { index }
Obj[key]=主题内容；吐槽
为什么要创建一个额外的变量。你知道ES6中的对象属性名是可以表达的吗？
改进
设obj={ }；
设index=1；
Obj[`topic${index}`]=主题内容；九、关于输入框非空的判断
在处理与输入框相关的业务时，经常会判断出输入框中没有输入值。
如果(值！==空值！==未定义的值！==){
//.
}吐槽
你了解ES6中新的空合并操作符吗？非要写这么多条件吗？
如果((值？) !==){
//.
}十、关于异步函数的吐槽
异步函数非常常见，并且经常被承诺实现。
常量fn1=()={
返回新承诺((解决，拒绝)={
setTimeout(()={
解决(1)；
}, 300);
});
}
常量fn2=()={
返回新承诺((解决，拒绝)={
setTimeout(()={
解决(2)；
}, 600);
});
}
const fn=()={
fn1()。然后(res1={
console . log(res1)；//1
fn2()。然后(res2={
console.log(res2)
})
})
}吐槽
这样调用异步函数，就不怕地狱回调了！
改进
const fn=async ()={
const res1=await fn1()；
const res2=await fn2()；
console . log(res1)；//1
console . log(res2)；//2
}补充
但是要做并发请求，还是要用Promise.all()。
const fn=()={
Promise.all([fn1()、fn2()])。然后(res={
console . log(RES)；//[1,2]
})
}如果在并发请求期间一处理完异步函数就返回结果，请使用Promise.race()。
十一、后续
欢迎反驳以上十位领导的言论。如果你的反驳是合理的，我会在下一次代码审查会议上为你反驳。
另外，以上整理内容如有错误，请在评论中指正。谢谢您们。
【相关视频教程推荐：web前端】以上是你说要用ES6的，赶紧用吧！更多详情请关注我们的其他相关文章！
郑重声明：本文由网友发布，不代表盛行IT的观点，版权归原作者所有，仅为传播更多信息之目的，如有侵权请联系，我们将第一时间修改或删除，多谢。