首先是陣列的解構賦值
1.這是等號左右型別一樣的情況下 陣列的元素是按次序排列的,變數的取值由它的位置決定 如下:
let [,,b] = [1,2,45]
console.log(b) // 45
let [a,,c]= [1,2,3]
console.log(a,c) // 1 3
let [d] =
console.log(d) // undefined
let [e,f] = [1]
console.log(e,f) // 1 undefined
let arr = [1,[2,3],4]
let [a,b,c] =arr;
console.log(a,b,c) // 1 [2,3] 4
2.等號左右型別不一樣的情況下
let [g] = 1
let [g] =0
let [g] =false
let [g] =undefiend // undefined is not defined
let [g] = nan
let [g] =null
let [g] = {}
console.log(g)// 1 0 false nan null {} is not iterable 1是不可迭代的 就是它轉為物件後或者本身沒有iterable介面所以解構時後報錯
3.等號左右一樣但是左右引數個數不一樣的情況下 右邊多了就不用管 左邊多了 多出的值就是undefined 當然左邊也可以設定預設的值 這樣當右邊對應的沒有值時(或者為undefined)也不至於成為undefined 它內部使用嚴格的=== 來判斷是否有值 來決定是否使用預設值
let [a='nihao',b] = [,'wanghongting']// console.log(a,b) // nihao wanghongting
let [a,b='wht'] = ['nihao',undefined] // console.log(a,b) // nihao wht
let [a,b='wht'] = ['nihao','undefined'] ;console.log(a,b) // nihao undefined 需要注意的是上面的和下面的不一樣的原因是 上面告訴我們右邊第二個資料是undeined型別的 說明沒有定義 而這個是字元『undefined』
let [a,b='wht',c,d,e] = ['nihao',null,number,boolean,string] ;console.log(a,b,c,d,e) // nihao null ƒ number() ƒ boolean() ƒ string() 如果是number string boolean 就會報錯 說它們undefined因為 陣列中除了數值,其它基本型別要加引號 就是字元
function fn()
let [a = fn()] = [1];
console.log(a) // 1 因為右邊對應的有值 所以不用使用預設值 fn就不用執行 如果右邊裡面對應的是undefined 那就會執行fn()
let [a = fn()] = [undefined]
console.log(a) // nihao undefined 因為這個函式並沒有返回值
預設值可以引用解構複製的其他變數,但是該變數必須已經宣告過了
let [x=2,y=x] = ; console.log(x,y) // 2 2
let [x=2,y=x] = [10]; console.log(x,y) // 10 10 之所以等於10是因為解構賦值右邊有定義的值
let [x = 1,y = x] = [10,11]; console.log(x,y) // 10 11 說明賦值比預設值優先順序高 如果右邊有對應的就按對應的 如果沒有就預設值
let [x=y,y=1] = [1,2]; console.log(x,y) // 1,2 不報錯 是因為右邊賦值給它了 不需要應用其他變數了用不到預設值
let [x=y,y=1] = ; console.log(x,y) // 報錯 cannot access 'y' before initialization 初始化之前找不到y 也就是上面說的可以引用其他變數 但必須先宣告
let [x=y,y=1] = [1]; console.log(x,y) // 1 1
let [x=y,y=1] = [,2]; console.log(x,y) // 報錯 cannot access 'y' before initialization
5.set 這種資料結構 也可以用陣列的解構賦值
let [a,b,c] = new set(['a1','b11','c1'])
console.log(a,b,c) //a1 b11 c1
物件的解構賦值
物件的屬性沒有次序,變數必須與屬性同名,才能取到正確的值 當然下面也有解決辦法 在下面3中有提到
let =
// 20 'wht' // 不像陣列的解構賦值次序要一一對應 物件不用的 只要等號左右有同名屬性就可以取到右邊的值
let = // 等號左右屬性名不相同 取不到值 屬於解構失敗 就是undefined
// undefined
可以很方便的將現有物件的方法賦值到某個變數
let = math ; // 12 等同於
math.abs(-12)
let = console
log('nihao') // 列印的是nihao
warn('jinggao') // 列印的是⚠️警告
變數名與屬性名不一致 可以這樣做到解構賦值 等於重新賦值
let =
console.log(nv) // 女
let obj =
let = obj
// 報錯 named is not defined
console.log(names,likes) // 列印的結果是 王婷 eat 也就是說解構賦值完畢 左邊的屬
性又把取到的值賦值給了新的變數 雖然named匹配到了 但是被賦值的是變數names
物件的巢狀解構賦值
let obj = ]
} //let ]} = obj;console.log(x,name) // 此時不能列印p 因為它已經賦值給後面的變數了 列印的結果 hello 王琪
let ]} = obj; console.log(p,name,x) // ['hello',] '王琪' 'hello' 第二個p是乙個模式 類似上面的賦值給變數的角色
let node =
}} let , loc: } } = node
console.log(loc, start, line, column) // column: 2line: 1__proto__: object 1 2
let obj = {};
let arr = ;
( = ) // 用()抱起來是避免發生語法的錯誤
console.log(obj, arr) // [0]
5 物件的預設賦值
let = {} // console.log(x) // 2
let = // console.log(x,5) //1 5
let =
console.log(y)
// 預設值生效的條件是 物件的屬性值嚴格等於undefined
var = {} //和var = // 沒有定義就是等於undfined
3var = ;// console.log(x) // null
var = ; // 列印台是空
ES6 解構賦值
陣列的解構賦值 let a,b 12,13 let a,b,c d 13,15,16 let a,b c 78,12 23 let x,y 1,3,5 x 1,y 3 let x,y,z a x a,y undefined z let h,b 1,2,3,4 1,2,3,4 預設值 let x tr...
ES6解構賦值
一 基本用法 解構 destructuring 按照一定的模式,從陣列或者物件中提取值,對變數進行賦值。let par1,par2,par3 1,2 console.log par1,par2,par3 1 2 不完全解構時par3對值為undefined 解構賦值允許指定變數對預設值。let pa...
es6解構賦值
coding changes the world accumulating makes yourself 主要從三個方面講述 陣列式的解構賦值 物件式的解構賦值 函式中的解構賦值 preface 現今的變數宣告語法十分的直接 左邊是乙個變數名,右邊可以是乙個陣列 的表示式或乙個物件 的表示式,等等。...