ES6 destruct 解构

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/wangjun5159/article/details/86750503

destruct就是解构，简单来说，就是能将一个对象直接赋给另外一个对象、能将一个数组赋给另外一个数组。什么意思呢？我们来看例子。

数组解构

var arr=[1,2];
var [a,b]=arr;
console.log(a,b);//1,2

没有解构，需要这样写

var arr=[1,2];
var a,b;
a = arr[0];
b = arr[1];
console.log(a,b);//1,2

两者对比，可以看到，免去了声明变量、按索引取值赋值的繁琐，简单明了，看一下babel编译结果

var arr = [1, 2];
var a = arr[0],
    b = arr[1];
console.log(a, b); //1,2

对象解构

var sourObj = {name:"name",address:"address"};
var  {name1,address}=sourObj;
console.log(name1,address);//undefined address

看一下babel的编译结果

var sourObj = { name: "name", address: "address" };
var name1 = sourObj.name1,
    address = sourObj.address;

通过**name1 = sourObj.name1,**可以看到对象解构的原理就是将 源对象.目的属性赋值给目标参数，因为源对象没有name1属性，所以值为undefined