ES6中拓展运算符 ...
...运算符主要用于数组和对象的一些操作。
基本的应用场景分为一下几个:
1、函数调用:把数组转换为一个参数序列
function add(x, y) { return x + y; } const numbers = [4, 38]; add(...numbers) // 42
console.log(...numbers) // 4 38
2、数组和对象的复制拷贝
var arr1 = [1,2,3]; var arr2 = [...arr1]; arr2.push(4); console.log(arr1 === arr2); // false console.log(arr1); // [1,2,3] console.log(arr2);// [1,2,3,4]
var obj1 = { a:1, b:2 }; var obj2 = {...obj1}; console.log(obj2); //{ a:1, b:2} console.log(obj1 === obj2);// false
备注:上面拷贝对象或数组不等于源数组或对象,看起来好像是深拷贝,其实还是一个浅拷贝,还是指向同一个内存地址
3、合并数组、对象
const arr1 = ['a', 'b']; const arr2 = ['c']; const arr3 = ['d', 'e']; // ES5 的合并数组 arr1.concat(arr2, arr3); // [ 'a', 'b', 'c', 'd', 'e' ] // ES6 的合并数组 [...arr1, ...arr2, ...arr3] // [ 'a', 'b', 'c', 'd', 'e' ]
// 构造字面量数组
[1,2,...arr1, ...arr2, ...arr3]
输出 [1,2 'a', 'b', 'c', 'd', 'e' ]
var a={ a:'1' } var b={ b:'2' } var ab={...a , ...b} console.log(ab) //{a: "1", b: "2"}
4、字符串转数组,转对象
var demo = "hello" var str = [...demo]; console.log(str); // ["h", "e", "l", "l", "o"]