// 拓展运算符(...)
var arr = [1,2,3]
// 1、...arr 返回数组的各个值
console.log(...arr) // 1 2 3
console.log([...arr]) // [1,2,3]
function text1(x,y,z){
console.log(x) // 1
console.log(y) // 2
console.log(z) // 3
}
text1(...arr)
// 2、拷贝数组对象
// 在这里你会发现,这是一个深拷贝,其实不然,展开语法和 Object.assign() 行为一致, 执行的都是浅拷贝(只遍历一层)。
// 数组
var arr2 = [...arr]
console.log(arr2) // [1,2,3]
console.log(arr === arr2) // false
// 对象
var obj = {
a: 1,
b: 2
}
var obj2 = {...obj}
console.log(obj2) // {a: 1,b: 2}
console.log(obj === obj2) // false
// 3、构造字面量数组对象
// 数组
var arr3 = [...arr, ...arr2]
console.log(arr3) // [1,2,3,1,2,3]
// 对象
// 当key值相同时,会被覆盖
var obj3 = {...obj, ...obj2}
console.log(obj3) // {a: 1,b: 2}
// 当key值相同时,后一个会覆盖前一个的值
var obj6 = {
a: 3,
b: 4
}
var obj7 = {...obj, ...obj6}
console.log(obj7) // {a: 3,b: 4}
// 当key值不同时,会合并构造新的对象
var obj4 = {
c: 3,
d: 4
}
var obj5 = {...obj, ...obj4}
console.log(obj5) // {a: 1,b: 2,c: 3,d: 4}
// 4、字符串转数组
var dome = "hello";
var arr4 = [...dome];
console.log(arr4) // ["h", "e", "l", "l", "o"]
// 剩余语法
function text2(a, ...arr5){
console.log(a) // 1
console.log(arr5) // [2, 3, 4, 5]
}
text2(1,2,3,4,5)
var [a, ...arr6] = [1,2,3,4,5,6]
console.log(a) // 1
console.log(arr6) // [2, 3, 4, 5, 6]
var {b, ...obj8} = obj5
console.log(b) // 2
console.log(obj8) // {a: 1, c: 3, d: 4}