ES6数组扩展

1、扩展操作符

可以看成rest参数的逆运算

const a1 = [1, 2, 3]

console.log(...a1) // 1 2 3

// 应用场景:

1:复制数组

    const arr1 = [1, 2];

    const arr2 = [...a1];

2:合并数组
    const a1 = [1, 2, 3];
    const a2 = [4, 5, 6];
    const a3 = [7, 8, 9];

    ES5写法:a1.concat(a2).concat(a3);
    ES6写法:[...a1, ...a2, ...a3];
3:与解构赋值合用
    const a = [0, 1, 2, 3, 4, 5]
    ES5写法:const a1 = a[0],
                    a2 = a.slice(1);
    ES6写法:const [a1, ...a2] = a;

2、Array.from()

将类数组转化为数组

const obj = {
        '0': '哈',
        '1': '嘻',
        '2': '哦',
        '3': '呵',
        'length': 4
      }
      
ES5写法:console.log([].slice.call(obj));
ES6写法:console.log(Array.from(obj));

3、Array.of()

将一组值转化为数组

Array.of(0, 1, '4')
// [0, 1, '4']

4、数组实例的copyWithin()

在数组内部,将指定位置的成员复制到其他位置(替换之前的成员),然后返回当前数组。

const arr = [0, 1, 2, 3, 4, 5, 6];

arr.copyWithin(3)
// [0, 1, 2, 0, 1, 2, 3]

arr.copyWithin(3, 2)
// [0, 1, 2, 2, 3, 4, 5]

arr.copyWithin(3, 2, 4)
// [0, 1, 2, 2, 3, 5, 6]


// *** 只能分开使用,因为copyWidthin()会改变原数组

5、数组实例的find()和findIndex()

找出第一个符合条件的成员和下标,类似于filter,只不过为第一个

const arr = [0, 1, 2, 3, 4, 7, 6];

const temp = arr.find(function(item) {
    return item > 5
})

temp    // 7


const tempIndex = arr.findIndex(function(item) {
    return item > 5
})

tempIndex // 5

7、数组实例的fill()

用给定值填充数组,支持三个参数(一:替换的值;二:被替换的开始位置;三:被替换的结束位置

[1, 1,1, 1].fill(88)

// [88, 88, 88, 88]


[1, 1,1, 1].fill(88, 1, 3)

// [1, 88, 88, 1]

发布了9 篇原创文章 · 获赞 0 · 访问量 2481
展开阅读全文

没有更多推荐了,返回首页

©️2019 CSDN 皮肤主题: 大白 设计师: CSDN官方博客

分享到微信朋友圈

×

扫一扫,手机浏览