关于ecmascript:解构

数组解构

依据数组下标提取


const arr = [1,2,3]
const [foo,bar,baz] = arr                 // 等值
const [,,baz] = arr                       // 选值
const [foo,...rest] = arr                 // 残余值，... 最初一个成员应用，是个新数组
const [foo] = arr                         // 不齐全解构
const [foo,bar,baz,more,...bao] = arr     //more 为 undefined,bao=[]
const [foo,bar,baz,more="10",] = arr      // 默认值 more 取不到取默认值
const [foo] = []                          //foo=undefined

如果右侧不是可遍历的构造（Iterator）会报错

let [foo] = 1;
let [foo] = false;
let [foo] = NaN;
let [foo] = undefined;
let [foo] = null;
let [foo] = {};

数组解构默认值
当一个数组成员严格等于 undefined, 默认值会失效

let [x = 1] = [undefined];         x // 1

let [x = 1] = [null];              x // null

对象解构
数组解构依据下标程序解构，对象解构依据属性名匹配提取，它没有秩序

const obj = {name:'mcgee',age:18}
const {age,name,baz} = obj
console.log(name); //'mcgee'
console.log(baz);  //undefined

对象的解构赋值，能够很不便地将现有对象的办法，赋值到某个变量

const {log} = console  //log 是 console 的属性
log("foo")

let {floor,ceil} = Math

同名成员产生命名抵触

const name = "jack"
const {name} = obj
console.log(name);

const name = "jack"
const {name:objName} = obj // 重命名对象 name 属性
console.log(name,objName);

设置默认值

const {name:objName="rose"} = obj // 给 name 属性设置默认值
console.log(objName)

留神

因为 JavaScript 引擎会将 {x} 了解成一个代码块，从而产生语法错误。只有不将大括号写在行首，防止 JavaScript 将其解释为代码块，能力解决这个问题

let x;
{x} = {x: 1}; // SyntaxError: syntax error

let x;
({x} = {x: 1});

表达式尽管毫无意义，然而语法是非法的，能够执行

({} = [true, false]);
({} = 'abc');
({} = []);

字符串

字符串被转换成了一个相似数组的对象

const [a, b, , , e] = 'hello';
a // "h"
b // "e"
e//  "o"

let {length : len} = 'hello'; // 类数组对象都有 length 属性
len // 5

number 和 boolean

如果等号左边是数值和布尔值，则会先转为对象

let {toString: s} = 123;
s === Number.prototype.toString // true

let {toString: s} = true;
s === Boolean.prototype.toString // true

null 和 undefined

let {prop: x} = undefined; // TypeError
let {prop: y} = null; // TypeError

函数参数解构

解构用处

变量替换

函数返回多个值

函数参数

函数参数默认值

遍历 Map 构造（Map 是键值对数据结构）

输出模块指定办法

const {SourceMapConsumer, SourceNode} = require("source-map");

其余解构