ES6-ES11(Day7)

22 阅读1分钟

ES6-扩展运算符的介绍

【...】 能将【数组】转换为逗号分割的【参数序列】

示例:

const arr=['1','集合','string'];

// 声明一个函数

function arrs(){

        console.log(arguments);

}

arrs(arr);

//结果:Arguments [Array(3), callee: ƒ, Symbol(Symbol.iterator): ƒ]

arrs(...arr);//等同于 arrs('1','集合','string')

//结果:Arguments(3) ['1', '集合', 'string', callee: ƒ, Symbol(Symbol.iterator): ƒ]

ES6-扩展运算符的应用

1、数组的合并

const kuaizi=['王太利','肖央'];

const fenghuang=['曾毅','玲花'];

// ES5方法

const zuixuanxiaopingguo=fenghuang.concat(kuaizi);

console.log(zuixuanxiaopingguo);

//结果:(4) ['曾毅', '玲花', '王太利', '肖央']

// 扩展运算符合并

const zuixuanxiaopingguo=[...fenghuang,...kuaizi]

console.log(zuixuanxiaopingguo);

//结果:(4) ['曾毅', '玲花', '王太利', '肖央']

2、数组的克隆

const arr1=['E','G','M'];

const arr2=[...arr1];

// 若arr1中有引用数据类型,则此次拷贝为浅拷贝

console.log('arr2', arr2)

//结果:arr2 (3) ['E', 'G', 'M']

3、将伪数组转为真正的数组

const divs=document.querySelectorAll('div');

console.log('divs', divs);

//结果:divs NodeList(3) [div, div, div]

const divArr=[...divs];

console.log('divArr', divArr);       

 //结果:divArr (3) [div, div, div]