ES2015(ES6) 追加了一类 基本上操作符——展开操作符 采用四个点 … 则表示
它的促进作用是在调用函数、数组内部内部结构时 将数组函数或数组在句法微观展开展开; 构筑字面上量的第一类时以数组对的方式展开展开。
下面他们来看一看它的基本上用语：
// 展开基本上的数组
const arr = [apple,orange,banana];
console.log(…arr); // apple orange banana
// 动态上下面的句子而已在句法微观展开了数组arr 让arr中的每两个原素做为log函数的模块
构筑字面上量句法的数组
一般来说情况下构筑字面上量内部结构的数组他们会采用如 push splice unshift concat 等函数将原有数组做为新数组的一小部分。
展开操作符能更单纯加速的顺利完成此项组织工作。
const arr1 = [welcome,to];
const arr2 = [hello,…arr1,here]; // [“hello”, “welcome”, “to”, “here”]
链接数组
在拥有展开操作符以前 他们一般来说采用 concat 函数 展开数组的链接
const arr1 = [1,2,3];
const arr2 = [4,5];
const arr3 = arr1.concat(arr2); // [1,2,3,4,5]
数组拷贝
const arr1 = [1,2,3,4];
const arr2 = […arr1]; // [1,2,3,4]arr2.push(5,6); // 此时arr2 [1,2,3,4,5,6] arr1的结果不变
const arr3 = [[1,2,3],[4,5,6]];
const arr4 = […arr3]; // [[1,2,3],[4,5,6]];
arr4.pop().push(0);
// 执行后 arr4 [[1,2,3]]
// arr3 [[1,2,3],[4,5,6,0]]
从以上结果他们能看出 展开操作符只遍历展开数组的第一层(浅拷贝)。 展开的结果如果是引用类型则不继续向下遍历。 事实上它的行为和 Object.assign() 是相同的
第一类拷贝和合并
const obj1 = {username:zhangsan,age:25};
const obj2 = {username:wangwu,phone:13666666666}
// 采用展开操作符拷贝第一类(浅拷贝)
const copyObj = { …obj1 }; // { username:zhangsan , age:25 }
// 采用展开操作符合并第一类
const mergeObj = { …obj1,…obj2 }; // { username:wangwu , age:25 , phone:13666666666 }
采用展开操作符展开新第一类内部内部结构 本质上是讲原有第一类中的所有 可枚举 属性拷贝到新第一类中； 与 Object.assign() 不同的是 Object.assign()会触发setters 展开操作符不会。
rest模块(剩余模块)
用arguments第一类了。rest模块搭配的变量是两个数组，该变量将多余的模块放入数组中。 这个特性能让他们在一些特定环境更方便的去处理模块(例如没有arguments的箭头函数)
let myFn = (…values) => {
console.log(values);
}
myFn(1,3,5); // output: [1,3,5]
他们也能对部分模块采用rest模块，但是在rest模块后不能有其他模块(rest必须是最后两个模块)
let myFn = ( a, …values ) => {
if(Array.isArray(a)){
values.forEach(el=>{
a.push(el);
});
}
}
let arr = [1,2,3];
myFn(arr,ok,!);
// arr结果为 [1,2,3,ok,!]
let testFn = (a, …values , b) => {} // 报错
注意点: 在数组或函数模块中采用展开句法时, 只能用于 可迭代第一类(支持 iterator)
let o = {username:zhangsan};
let arr = […o]; // TypeError: o is not iterable
如何讲清楚函数防抖？
