ES6数组扩展 - 潘思研的个人空间 - 开源中国

安宇雨 - 随手采集
2018-10-13 16:47:11
前端开发
ES6

ES6关于数组的扩展一共有以下8种，其中使用率比较高的有find()、entries()、keys()、values()和includes()。

Array.from()
Array.of()
数组实例的copyWithin()
数组实例的find()和findIndex()
数组实例的fill()
数组实例的entries()，keys()和values()
数组实例的includes()
数组的空位

find()用于查找符合条件的数组成员，它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。
```
[1, 2, -3, 8, -2 ,10].find((item,index,array) => item < 0)
// -3 这里只返回满足条件的第一个成员，所以-2是不会被找到的
```
熟练使用这个函数，基本可以告别underscore、lodash了，值得一提的是，原本使用indexOf()函数，会存在一个问题，无法发现NaN，而使用find()、findIndex()则会发现NaN，这对我们在一些特定的数据结构中处理数据是有很大帮助的。
```
[NaN].indexOf(NaN)
// -1
[NaN].findIndex(y => Object.is(NaN, y))
// 0 借助回调及Object.is来处理NaN
```

entries()、keys()、values()这三个函数用于遍历数组。唯一的区别是keys()对键名的遍历、values()是对键值的遍历，entries()对键值对的遍历。

for (let index of ['a', 'b'].keys()) {
  console.log(index);
}
// 0
// 1
for (let item of ['a', 'b'].values()) {
  console.log(item);
}
// 'a'
// 'b'
for (let [index, item] of ['a', 'b'].entries()) {
  console.log(index, item);
}
// 0 "a"
// 1 "b"

includes()函数返回一个布尔值，表示某个数组是否包含给定的值。该方法属于ES7，但Babel转码器已经支持。
```
[1, 2, 3].includes(2);     // true
[1, 2, 3].includes(4);     // false
```
这样就可以代替使用indexOf()循环判断是否等于-1的方法了。

原网址: 访问
创建于: 2018-10-13 16:47:10
目录: default
标签: 无

未标明原创文章均为采集，版权归作者所有，转载无需和我联系，请注明原出处，南摩阿彌陀佛，知识，不只知道，要得到