ES6～解构赋值

解构赋值：

定义：

ES6按照统一模式，从数组和对象中提取值，对变量进行赋值，这样被称为解构．

注意：

**1.**node.js目前還不支持解构赋值，所以我们需要利用babel转换器来转换代码来看输出的结果．

npm install gulp --save-dev
npm install gulp-babel --save-dev

npm install babel-preset-es2015 --save-dev

// gulpfile.js
var gulp=require('gulp'), babel=require('gulp-babel');

gulp.task('build',function(){
    return gulp.src('./test.js')
            .pipe(babel())
            .pipe(gulp.dest('./build'))    
})

// .babelrc
{
    "presets": ["es2015"]
}

2.解构赋值，赋给 var, let , const 定义的变量都可以

解构数组：

ES5中：

var point=[３,2];
var x=point[0];
var y=point[1];
console.log(x);//３
console.log(y);//2

ES6下：

let point = [1, 2];
let [x, y] = point;
console.log(x);//1
console.log(y);//2

应用这个特性我们可以很容易的

交换变量：

let point = [1, 2];
let [x, y] = point;
console.log(x);
console.log(y);
//reverse
[x,y]=[y,x];
console.log(x);//2
console.log(y);//1

忽略某些值

let hello=[1,2,3];
let [a, ,c]=hello;
console.log(a);//1
console.log(c);//3

嵌套数组

let nihao = [1, [2, 3], 4];
let [a, b, c] = nihao;
console.log(a);//1
console.log(b);//2
console.log(c);//4

结构赋值变量

let [head,... tall]=[1,2,3,4];
console.log(head);//1
console.log(tall);//4

解构对象

注意：对象的属性没有次序，变量必须与属性同名，才能取到正确的值

let points = {
    x: 1,
    y: 2
};
let {x, y} = points;
console.log(x);//1
console.log(y);//2

如果变量名和属性名不同，我们必须进行转换：

let points2={
    x:1,
    y:2
};
let {x:a,y:b}=points2;
console.log(a);//1
console.log(b);//2

支持嵌套对象

let point3 = {
    x: 1,
    y: 2,
    z: {
        one: 3,
        two: 4
    }
};
let {x: a, y: b, z: {one: c, two: d}} = point3;
console.log(a);//1
console.log(b);//2
console.log(c);//3
console.log(d);//4

１．当然它也支持混合模式，即可以嵌套数组和对象
２．有了解构赋值，我们就可以模拟函数多返回值．

function mix() {
    return {
        a: 1,
        b: 2,
        values: [3, 4, 5]
    };
}
let {a: x, b: y, values: [z, , m]} = mix();
console.log(x);//1
console.log(y);//2
console.log(z);//3
console.log(m);//5

如果我们解构赋值时，忽略var,let,const那么就会出错因为block不能被解构赋值但是，我们赋值加上let或者把整个赋值语句用（）括起来就OK

let point = {
x: 1
};
({ x: a } = point);
console.log(a); // 1 

字符串的解构赋值

const [a, b, c, d, e] = 'hello';
a // "h"
b // "e"
c // "l"
d // "l"
e // "o"
let {length: len} = 'hello';
len//5

它还它有一些特性：
１．函数参数的解构赋值
２．解构赋值的默认值一般为０，undefined
3.ES6内部使用严格相等运算符
( 如果一个数组成员是null，默认值就不会生效，因为null不严格等于undefined.)
(如果一个默认值是一个表达式，那么这个表达式是只有在用到的时候，才会求值的．)
（默认值可以引用解构赋值的其他变量，但是变量必须已经声明）

let [x = y, y = 1] = [];     // ReferenceError

４．对象的解构赋值，可以很方便的将现有对象的方法，赋值到某个变量

let { log, sin, cos } = Math;

原文链接