1. 數(shù)組的解構(gòu)賦值
ES6允許按照一定模式,從數(shù)組和對象中提取值怎棱,對變量進(jìn)行賦值哩俭,這被稱為結(jié)構(gòu)。
var [a,b,c] = [1,2,3]; //合法
let [head, ...tail] = [1,2,3,4]; //head = 1;tail = [2,3,4]
let [x,y,z] = new Set(["a","b","c"]);
- 解構(gòu)賦值允許指定默認(rèn)值拳恋。
var [foo = true] = []; //foo = true
注意:ES6內(nèi)部嚴(yán)格相等運算法(===)判斷一個位置是否有值凡资。所以,如果一個數(shù)組成員不嚴(yán)格等于undefined谬运,默認(rèn)值不生效隙赁。
2. 對象的解構(gòu)賦值
數(shù)組按照元素的次序排序賦值,而對象的屬性沒有次序梆暖,變量必須與屬性同名伞访,才可以獲取到正確的值
var {bar, foo} = {foo:"aaa", bar:"bbb"}; //foo="aaa",bar="bbb"
如果變量名和屬性名不一致,必須寫成下面這樣
var {foo:baz} = {foo:'aaa', bar:'vvv'}; //baz='aaa'
注意:對象的解構(gòu)賦值的內(nèi)部機制轰驳,是先找到同名屬性厚掷,然后再賦值給對應(yīng)得變量。真正被賦值的是后者级解,而不是前者冒黑。
var { foo: baz } = { foo: "aaa", bar: "bbb" };
baz // "aaa"
foo // error: foo is not defined
- 默認(rèn)值生效的條件是:對象的屬性值嚴(yán)格等于undefined
- 如果解構(gòu)模式是嵌套的對象,而且子對象所在的父屬性不存在蠕趁,則報錯薛闪。
3. 字符串的解構(gòu)賦值
- 字符串也可以解構(gòu)賦值,此時俺陋,字符串被轉(zhuǎn)換成一個類似數(shù)組的對象豁延。
- 類似數(shù)組的對象都有一個length屬性,因此可以對這個屬性解構(gòu)賦值腊状。
4. 數(shù)值和布爾值的解構(gòu)賦值
-
解構(gòu)賦值時诱咏,如果等號右邊是數(shù)值和布爾值,則會先轉(zhuǎn)為對象缴挖。
let {toString: s} = 123;
s === Number.prototype.toString // truelet {toString: s} = true; s === Boolean.prototype.toString // true
解構(gòu)賦值的規(guī)則是:只要等號右邊的值不是對象袋狞,就先將其轉(zhuǎn)為對象。由于undefined和null無法轉(zhuǎn)為對象映屋,所以對它們進(jìn)行解構(gòu)賦值苟鸯,都會報錯。
5. 函數(shù)參數(shù)的解構(gòu)賦值
[[1, 2], [3, 4]].map(([a, b]) => a + b);// [ 3, 7 ]
- 函數(shù)參數(shù)的解構(gòu)也可以使用默認(rèn)值棚点。
6. 圓括號問題
ES6規(guī)定早处,只要有可能導(dǎo)致解構(gòu)的歧義,就不得使用圓括號瘫析。
- 不能使用圓括號的情況
- 變量聲明語句中砌梆,不能帶有圓括號默责。
var [(a)] = [1]; //報錯
- 函數(shù)參數(shù)中,模式不能帶有圓括號咸包。
function f([(z)]) {}; //報錯
- 賦值語句中桃序,不能將整個模式,或嵌套模式中的一層烂瘫,放在圓括號中媒熊。
({ p: a }) = { p: 42 }; //全部報錯
[({ p: a }), { x: c }] = [{}, {}];
- 可以使用圓括號的情況
- 賦值語句的非模式部分,可以使用忱反。
[(b)] = [3]; // 正確
({ p: (d) } = {}); // 正確
7. 用途
- 交換變量的值泛释。
[x,y] = [y,x];
- 從函數(shù)返回多個值
// 返回一個數(shù)組
function example() {
return [1, 2, 3];
}
var [a, b, c] = example();
// 返回一個對象
function example() {
return {
foo: 1,
bar: 2
};
}
var { foo, bar } = example();```
- 函數(shù)參數(shù)的定義
解構(gòu)賦值可以方便地將一組參數(shù)與變量名對應(yīng)起來。
// 參數(shù)是一組有次序的值
function f([x, y, z]) { ... }
f([1, 2, 3]);
// 參數(shù)是一組無次序的值
function f({x, y, z}) { ... }
f({z: 3, y: 2, x: 1});
- 提取JSON數(shù)據(jù)
var jsonData = {
id: 42,
status: "OK",
data: [867, 5309]
};
let { id, status, data: number } = jsonData;
console.log(id, status, number);
// 42, "OK", [867, 5309]
- 函數(shù)參數(shù)的默認(rèn)值
- 遍歷Map結(jié)構(gòu)
var map = new Map();
map.set('first', 'hello');
map.set('second', 'world');
for (let [key, value] of map) {
console.log(key + " is " + value);
}
// first is hello
// second is world
- 輸入模塊的指定方法***???***
const { SourceMapConsumer, SourceNode } = require("source-map");