es6笔记（3） 变量的解构赋值

基本概念

本质上是一种匹配模式，只要等号两边的模式相同，那么左边的变量就可以被赋予对应的值。

// 以往定义接个变量的时候，需要这样
var a = 1,
b = 2,
c = 3;
// 使用ES6解构赋值，可以这样写
let [a,b,c] = [1,2,3];

解构赋值的几种方式

1. 数组的解构赋值

let [foo,[[bar],baz]] =[1,[[2],3]];
console.log(foo,bar,baz); //输出1,2,3

解构赋值是可以使用缺省的方式用于占位

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

如果解构赋值时，没有找到对应的值会怎样？

let [a] = [];
console.log(a); //解构失败 undefined;

let [y = 1] = [];
console.log(y); //因为第二个等号，解构失败。输出 1

2. 对象的解构赋值

我们知道，对象和数组不太一样，1对象是有属性的，2对象是无序的。那么变量的解构赋值如何进行呢？

//=======变量名，与属性名一致==========
//此时会按照变量名，
//与右侧的属性名匹配，如果一致就赋值。
let {a,b}={b:'bbbb',a:'aaaa'};
console.log(a); // aaaa

//=======变量名，与属性名不一致=========
let {a:b} ={a:1};
console.log(b); // 1
console.log(a); // 报错
//真正被赋值的是变量，而不是前面属性

3. 基本类型的解构赋值

字符串在某些情况下会被当成数组使用

let [j,d] = "12";
console.log(j,d); //1 2

直接获得字符串的长度，通过prototype。

let {length:len} = 'jd';
console.log(len); //2

可以直接拿到类型prototype上的方法

let{toString:ts} = 1;
let{toString:bs} = true;

console.log(ts);  //输出  Number.prototype.toString 方法
console.log(bs);  //输出  Boolean.prototype.toString 方法

null 和 undefined不能解构赋值

let a = undefined;   //直接报错