Es6 - 扩展运算符和rest运算符

扩展运算符和rest运算符

它们可以很好的为我们解决参数和对象数组未知情况下的编程，让我们的代码更健壮和简洁。

对象扩展运算符 （。。。）

function fun(...arg) {  console.log(arg[0])  console.log(arg[1])  console.log(arg[2])}fun('aa', 'bb')
打印结果  aa  bb undefined复制代码

即使没有第三个参数也不会报错 aa bb undefined

使用场景

var arr1 = [1,2,3]var arr2 = arr1arr2.push(4)console.log(arr1)     [1, 2, 3, 4]console.log(arr2)     [1, 2, 3, 4]复制代码

arr1 和 arr2 地址内存空间相同，会相互影响
修改

var arr1 = [1,2,3]var arr2 = [...arr1]arr2.push(4)console.log(arr1)     [1, 2, 3]console.log(arr2)     [1, 2, 3, 4]复制代码

问题解决

rest运算符

function fun(first, ...arg) {  console.log(arg.length);}fun(0, 1, 2, 3, 4, 5, 6, 7);复制代码

es5

function fun(first, ...arg) {  console.log(arg.length);  for (let i = 0; i < arg.length; i++) {    console.log(i)  }}fun(0, 1, 2, 3, 4, 5, 6, 7);复制代码

es6

function fun(first, ...arg) {  console.log(arg.length);  for (let val of arg) {    console.log(val)  }}fun(0, 1, 2, 3, 4, 5, 6, 7);复制代码

rest 是剩余的意思，也就是说 除了已知确定的参数之外，其他剩余的参数可以使用 （...arg）展开，在 es6 可以使用 for of 的循环方式代替 es5 的for 循环。

转载于:https://juejin.im/post/5d0a0833e51d45775a700322