欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

ES6 解构

程序员文章站 2022-04-15 15:36:37
第五章 解构:使数据访问更便捷 对象解构 let node = { type: 'id', name: 'foo', }; let {type, name} = node; // type === 'id', name === 'foo' let {type: TYPE, name: NAME} = ......

第五章 解构:使数据访问更便捷

对象解构

let node = {
  type: 'id',
  name: 'foo',
};

let {type, name} = node; // type === 'id', name === 'foo'
let {type: type, name: name} = node; // type === 'id', name === 'node'

默认值

可以在结构语句中添加默认值,使其覆盖false like的值

let {type, name, value = '123'} = node;

嵌套对象解构

将对象拆解以获取你想要的信息。

let {loc: {start}} = node; // 从node中提取node.loc.start,赋值给start

数组解构

使用数组字面量,且解构操作全部在数组内完成。

let colors = ['red', 'greed', 'blue'];

let [first, second] = colors; // first === 'red', second === 'green'
let [, , third] = colors; // third === 'blue'
let [, , , fourth = 'black'] = colors // 使用默认值,fourth === 'black'

数组的解构可以用来交换变量

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

不定元素

数组的解构可以使用扩展运算符...来分拆或组合数组。

let [first, ...rest] = colors; // rest = ['green', 'blue']
let mixed = [...colors, ...rest]; // mixed = ['red', 'green', 'blue', 'green', 'blue']

解构参数

在函数的参数表中,可以直接将某个参数对象的属性通过解构的方式获得,从而在函数中作为变量使用。

解构参数建议提供被解构对象的默认值{},从而避免从undefined中去解构,产生报错。

解构时,可以为每个解构的属性提供默认值。