变量的解构赋值

2017-04-17  本文已影响0人  小狮子_3e1e

基本

ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构

比如要为a,b,c三个变量赋值

let a = 1;
let b = 2;
let c = 3;

es6允许写成

let [a,b,c]=[1,2,3]

只要两边的结构相同,左边的变量就会被赋予右边对应的值
当结构不成功,值会等于undefined

let [b] = []
let [a,b]=[1]

b的值会等于undefined
上面是一种情况 ,还有另一种情况

let [x,y] = [1,2,3] // x=1;y=2
let [x,[y],z]= [1,[2,3],4] // x=1 y=2 z=4

上面的情况为不完全结构,即只匹配一部分右边的数组,但是依旧可以结构成功
等号的右边必须是可遍历的结构,否则会报错

let [a] = 1;
let [a] = false;
let [a] = NaN;
let [a] = undefined;
默认值

解构允许有默认值

let [a,b=1] =[2]  // a=2 b=1 

ES6 通过严格相等运算符判断一个值是否有值, ===undefined 默认值才会生效

let [a=1]=[undefined];//a=1
let[a=1] = [null] ;//a=null

如果默认值是表达式,那么表达式只在没有值的情况下执行.
默认值可以使用结构赋值的其他变量,但该变量必须已经赋值否则会报错

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

对象的解构与数组相似,但是数组按照顺序排列,变量取值可以根据次序觉得;对象没有顺序,所以变量必须与属性同名

let { a, b } = { a: "aaa", b: "bbb" };
a // "aaa"
b // "bbb"
let { c } = { a: "aaa", b: "bbb" };
c //'undefined'
函数参数

函数参数也可以解构赋值

function add([a, b]){
  return a + b;
}
//带默认值
function move({x = 0, y = 0} = {}) {
  return [x, y];
}

other

字符串,数字,布尔值,也可以解构
字符串会被转换成类似数组的对象,
数值和布尔值则会转成对象.
undefined和null不能转成对象,所以无法进行解构赋值

上一篇下一篇

猜你喜欢

热点阅读