【es6】解構賦值
阿新 • • 發佈:2019-02-10
基本用法
let [x, y, ...z] = ['a']
//"a", undefined, []
1.等號右邊如果不是陣列,將會報錯(不是可遍歷結構)
2.解構賦值 var, let, const命令宣告均適用
3.set結構也可解構賦值(具有Iterator介面,可採用陣列形式結構賦值)
set解構:任何型別的單個值的集合
let [x, y, z] = new Set(["a", "b", "c"])
x //"a"
預設值
1.陣列成員的值不嚴格等於undefined,預設值不生效(null的話相應值依然為null)
[x=1 , y=2, z=3, o=4] = ['a', , undefined, null]
//"a", 2, 3, null
2.如果預設值是表示式,表示式惰性求值,只有在用到的時候才會去執行
3.預設值可以引用結構賦值的其他變數,但該變數必須已宣告
物件結構賦值
1.陣列按次序排列,物件變數必須與屬性同名
var {bar, foo, baz: loc} = {foo: 'aaa', baz: 'bbb'}
bar //undefined
foo //"aaa"
loc //"bbb"
baz //ReferenceError: baz is not defined
2.變數以前宣告過,使用let賦值會報錯
3.可用於巢狀結構的物件
var node = {
loc: {
start: {
line: 1,
column: 5
}
}
}
var {loc:{start:{line}}} = node
line //1
loc //ReferenceError: loc is not defined
start //ReferenceError: start is not defined
line是變數,loc,start都是模式
4.物件結構可以指定預設值
(生效條件是物件屬性值嚴格等於undefined,null不會生效,解構失敗值為undefined)
5.解構模式是巢狀物件,且子物件父屬性不存在,報錯
6.已宣告的變數解構賦值
var x;
{x}={x:1} //SyntaxError: Unexpected token =
({x}={x:1}) //正確
js會將{x}理解成程式碼塊,不將大括號寫在行首即可
7.可以將現有物件的方法賦值到某個變數
let { sin, cos, log } = Math(Math物件的名為sin的方法直接賦值給sin變數)
字串解構賦值
const [a,b] = 'hello' a//h
let {length:len} = 'hello' len//5(字串本身包含length屬性)
數值&布林值
解構賦值規則:
- 只要等號右邊不是物件先將其轉化為物件,
- undefined和null無法轉換為物件,報錯
let a = true
{b} = {a}
//Object {a: true}
函式引數解構
[[1,2],[3,4]].map((a,b)=>a+b) //[3,7]
function({x=0,y=0}={}){
return [x,y]
}
undefined會觸發函式引數預設值
圓括號問題
1.變數宣告語句中,模式不能帶有圓括號 let {x:(c)} = {}
2.函式引數中,模式不能帶有圓括號(函式引數也屬於變數宣告)
3.整個模式或巢狀模式中的一層,不可放入圓括號
賦值語句的非模式部分可使用
用途
1.[x, y] = [y, x]
2.函式返回的多個值分別賦值
3.函式引數與變數名對應
4.提取json資料(ajax請求返回資料處理中可用到)
({
needServicePwd: this.needServicePwd,
needImgCode: this.needImgCode,
needSmsCode: this.needSmsCode
} = data)
5.函式引數的預設值,避免在函式內寫var foo = config.foo || ”
6.遍歷Map結構
var map = new Map();
map.set('first', 'hello');
map.set('second', 'world');
for (let [key, value] of map) {
console.log(key + " is " + value);
}
7.引用模組的指定方法
const { SourceMapConsumer, SourceNode } = require("source-map");