介绍
或许是因为 ES7/ES8
更新的东西相比 ES6
来说比较少,所以关于他们的文章和知识也就用得比较少,反正我也是整理一点咯。
1、ES7 - includes()
Array.prototype.includes()
使用场景:验证数组中是否存在某个元素。
1-不使用ES7 使用 indexOf()
判断返回值是否 -1
,若是则为不存在,反之存在。
1 | let t = ['hello','leo','perfect']; |
2-使用ES7 使用 includes()
简单判断,返回 True
为存在,False
不存在。
1 | let t = ['hello','leo','perfect']; |
2-使用ES7
使用指数运算符**,就像+、-等操作符一样:
1 | console.log(7**3); |
3、ES8 - Object.values()
通常用于遍历对象的属性值。
1-不使用ES8
使用Object.keys()遍历对象的属性值,需要通过属性名key去获取属性值:
1 | let obj = {a: 1, b: 2, c: 3}; |
2-不使用ES8
使用Object.values()遍历对象的属性值,无需使用使用属性名:
1 | let obj = {a: 1, b: 2, c: 3} |
4、ES8 - Object.entries()
遍历对象的属性名和属性值。
1-不使用ES8
使用Object.keys()遍历对象的属性名和属性值:
1 | let obj = {a: 1, b: 2, c: 3}; |
2-不使用ES8
使用Object.values()遍历对象的属性值,无需使用使用属性名:
1 | let obj = {a: 1, b: 2, c: 3}; |
5、ES8 - padStart()
在字符串前面填充指定的字符串。
1-不使用ES8
使用Object.keys()遍历对象的属性名和属性值:
1 | console.log('0.00') // 0.00 |
2-不使用ES8
使用padStart()可以在字符串前面填充指定的字符串:
1 | console.log('0.00'.padStart(20)) // 0.00 |
6、ES8 - padEnd()
在字符串后面填充指定的字符串。
1-不使用ES8
使用Object.keys()遍历对象的属性名和属性值:
1 | console.log('0.00 ' + '0.00' ) // 0.00 0.00 |
2-不使用ES8
使用padEnd()可以在字符串后面填充指定的字符串:
1 | console.log('0.00'.padEnd(20) + '0.00' ) // 0.00 0.00 |
7、ES8 - 函数参数列表结尾允许逗号
1-不使用ES8
1 | var f = function(a, |
2-使用ES8
1 | var f = function(a, |
允许逗号之后,可以避免一些不必要的报错。
8、ES8 - Async/Await
使用Promise
使用Promise写异步代码,会比较麻烦:
1 | axios.get(`/q?query=${query}`) |
使用Async/Await
Async/Await使得异步代码看起来像同步代码,这正是它的魔力所在:
1 | async fetchData(query) => |
Async/Await
是写异步代码的新方式,以前的方法有 回调函数
和 Promise
。相比于 Promise
,它更加简洁,并且处理错误、条件语句、中间值都更加方便,因此有望替代 Promise
,成为新一代的一步代码编写方式。