ES6 中那些被忽略的优雅方法

Array


1. find(value, index, arr)

在某些情况我需要判断一个数组是不是符合一些逻辑的条件 比如需要判断[{id: 1}, {id: 2}, {id: 3}]中是否有含有符合 id=1的数据; 以前我会使用filter方法。 const array = [{id: 1, name: 'a'}, {id: 2, name: 'b'}, {id: 3, name: 'c'}]; const isTrue = array.filter(obj => obj.id === 1).length;
然而在ES6中包含了一个find方法, 实际上更优雅的写法应该是 const array = [{id: 1}, {id: 2}, {id: 3}]; const isTrue = array.find(obj => obj.id === 1); find方法将会对数组进行遍历,如果有符合条件的数据将结束遍历并返回数据,没有的话返回undefined而不像filter完整的遍历完数组。
所以如果你只需要对数据进行bool判断或者拿一个数据时候, 建议使用find
除了 find 还有一个方法是findIndex与find用法类似, 不过findIndex 返回的是数组成员的位置, 没有返回-1
这两种方法类似,看情况决定使用哪一种

2. from和[…obj]

Array.from 可以对类似数组的对象转成数组,比如 DOM 中上传图片的input.files 实际上也可以使用[…]代替,而且更简洁。但是使用... 必须对象实现了Iterator方法否则会报错。 使用场景: 以前如果上传多个文件需要显示所有文件的名字和进度的话,需要创建有一个存放相关数据的数组 const array = []; for (obj of input.files) { // for of 实际上也是对实现Iterator方法的对象遍历 array.push(obj); }; // from const array = Array.from(input.files); // ... const array = [...input.files]; //cool [...'123'] // ['1', '2', '3'];

3. fill();

如果我需要实现一个简单的桶算法的话, 比如对范围在0-100的20个整数排序的话 我首先需要创建一个长度为101, 默认值为0的 数组需要 const array = []; for (let i = 0; i<101; i++) { array.push(0); } 如果使用fill只需要 const array = new Array(101).fill(0); Array.fill(value) 方法会对数组填充数组成员, 填充长度等于数组长度
转自:http://www.jianshu.com/p/0f197e102b4f 版权声明:除特别注明外,本站所有文章均为田珊珊个人博客原创 转载请注明:出处来自田珊珊个人博客 » ES6 中那些被忽略的优雅方法
点赞

发表评论

电子邮件地址不会被公开。 必填项已用*标注
  • 中青看点说道:
    这样精彩的博客越来越少咯!
  • 白云说道:
    @中青看点 看起来确实可以
  • 约炮把妹说道:
    很少能看到这么专注的博客啦!
  • 中医秘方说道:
    一言不发岂能证明我来过了?!
  • U乐娱乐注册