[ES6] 解构赋值

解构(Destructuring)

ES6 允许从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructuring)。

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

本质上,这种写法属于“模式匹配”,只要等号两边的模式相同或者可以匹配上,左边的变量就会被赋予对应右边的值。

let [first, [[second], third]] = [1, [[2], 3]];
first // 1
second // 2
third // 3

let [ , , third] = ["first", "second", "third"];
third // "third"

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

let [head, ...tail] = [1, 2, 3, 4];
head // 1
tail // [2, 3, 4]

如果变量匹配不上导致解构不成功,变量的值就等于undefined。一般解构不成功是因为等号右边的值无法匹配上等号左边的变量。
要是等号左边的变量只能匹配到部分等号右边的值,称为不完全解构

let [foo] = []; //undefined
let [first, foo] = [1]; //foo is undefined

针对数组的解构,如果等号右边的值是不可遍历的,则解构时会报错。

// 以下均会报错
let [foo] = 1;
let [foo] = false;
let [foo] = undefined;
let [foo] = null;
let [foo] = {};

解构不仅可以用在数组上,也可以用在对象中。对象的解构与数组不一样的地方在于,数组解构时严格按照顺序进行匹配,而对象则需要按照同名的属性进行匹配。

let { first, second } = { first: '111', second: '222' };
first // "111"
second // "222"

需要注意的是,因为数组本质是特殊的对象,因此可以对数组进行对象属性的解构。

let arr = [1, 2, 3];
let {0 : first, 2 : third} = arr;
first // 1
third // 3
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 数组的解构赋值 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构(Destructur...
    _羊羽_阅读 545评论 0 1
  • 前面的话 我们经常定义许多对象和数组,然后有组织地从中提取相关的信息片段。在ES6中添加了可以简化这种任务的新特性...
    sunnyghx阅读 768评论 0 0
  • 引入 在ES5中,开发者们为了从对象和数组中获取特定数据并赋值给变量,编写了许多看起来同质化的代码 这段代码从op...
    nengzhuan_zhang阅读 626评论 0 0
  • 解构 ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值 数组解构赋值 本质上这种写法相当于模式匹配如...
    heheheyuanqing阅读 398评论 0 0
  • 在springboot项目中,通过idea在配置spring.profiles.active (1)在window...
    路xing阅读 28,191评论 3 5