ES6 解构赋值--一般用法

 

解构（Destructuring）：ES6 允许按照一定模式，从数组和对象中提取值，对变量进行赋值。

<script>
let a = 1;
let b = 2;
let c = 3;
script>

等价于： 可以从数组中提取值，按照对应位置，对变量赋值。==只要左右两边相等，就会赋值，如果解构不成功，变量的值就等于undefined

<script>
 
//等价于
let [a,b,c]=[1,2,3]
script>

<script>
 
let [ , , third] = ["foo", "bar", "baz"];
console.log(third)
script>

0、 只要等号两边的模式相同，左边的变量就会被赋予对应的值。

<script>
 
let [head, ...tail] = [1, 2, 3, 4];
console.log(head)// 1
console.log(tail)// [2, 3, 4]
script>

1、如果解构不成功，变量的值就等于undefined 

<script>
 
let [x, y, ...z] = ['a'];
console.log (x) // "a"
console.log(y) // undefined
console.log(z) // []
script>

2、不完全解构，即等号左边的模式，只匹配一部分的等号右边的数组。这种情况下，解构依然可以成功。——两个情况

<script>
 
let [x, y] = [1, 2, 3];
 
console.log (x) //1
console.log(y) //2
 
script>

<script>
 
let [x, [y], z] = [1, [2, 3], 4];
 
console.log (x) //1
console.log(y) //2
console.log(z)//4
 
script>

3、如果等号的右边不是数组（是不是可遍历的结构），那么将会报错。

<script>
// 报错--全部-每一句
let [foo] = 1;
// let [foo] = false;
// let [foo] = NaN;
// let [foo] = undefined;
// let [foo] = null;
// let [foo] = {};
script>

等号右边的值(false,NaN,undefined,null)赋值转化为对象不具备Iterator 接口，对象本身不具备Iterator 接口