扩展运算符（...）的用途

meiw

1.合并数组

一直以来，有很多方法合并数组，但是扩展运算符给了我们全新的方法去实现合并数组：

•                
  
  arr1.push(...arr2) // 把arr2合并到arr1的后面
•                
  
  arr1.unshift(...arr2) //把arr2合并到arr1的前面
  

如果你想在数组内合并数组，你可以像下面这样做：

•                
  
  var arr1 = ['two', 'three'];
•                
  
  var arr2 = ['one', ...arr1, 'four', 'five'];
  

2.复制数组

复制数组是我们常常要做的工作，在过去，我们会使用Array.prototype.slice去实现，但现在我们可以使用扩展运算符去得到一个复制后的数组：

•                
  
  var arr = [1,2,3];
•                
  
  var arr2 = [...arr]; // 就像 arr.slice()
•                
  
  arr2.push(4)
  

3.结构赋值

结构赋值是一个十分有趣的实践，我在自己的React项目中大量的使用了这种技巧。你可以使用扩展运算符配合其他运算符一起，从变量中提取有用的信息，就像这样：

•                
  
  let { x, y, ...z } = { x: 1, y: 2, a: 3, b: 4 };
•                
  
  console.log(x); // 1
•                
  
  console.log(y); // 2
•                
  
  console.log(z); // { a: 3, b: 4 }
•