数组和对象解构赋值

193 阅读2分钟

数组与对象解构赋值的区别:

数组通过下标赋值,对象通过名值对的名是否相等赋值
数组和对象解构失败的值均为undefined
两者传入的默认值,当传入数组成员 === undefined时,默认值生效。
   
   let [a = 1, b = 2] = [ 3, undefined]  ==》 a=3,b=2
   let {a = 1, b = 2} = { a : 3, undefined}

解构数组:

数组通过下标对应赋值
[a,b] = [1,2]
[a, , c] = [1,2,3]

fn () { return [1,2] } 
[a,b] = fn ()

解构对象:

内部机制,先找到名值对的名,匹配成功,再赋给对应的变量,真正赋值的是后者
let { foo: yhh } = { foo: 999}   ==> 	yhh = 999

名值对中的值必须为变量才可赋值,否则报 无效的解构的任务目标
let {p:1, q:"asd", g:true}  	错误(数字,字符串,布尔类型均为固定值)
let {p:foo, q: tdd}				正确

无声明字面量解构赋值是必须整体外套小括号()
当大括号写在行首时会被视为代码块
let {a,b} = {a:1,b:2}  ===  ( {a,b} = {a:1,b:2} )

数组嵌套数组

let obj = [1,2,[3,4]]
let ary = [q,w,[e,f]] = obj
console.log(...ary);

数组嵌套对象

let obj = [1,2,{a:3,b:4}]
let art = [d,f,{a:h,b:k}] = obj
console.log(...ary);

对象嵌套对象

let obj = { a: 1, b: 2,df: { c:3, d:4}}
let ary = { a: f, b: g, df: { c: h, d: k } } = obj
console.log(ary);
  

对象嵌套数组

 let obj = { a: 1, b: 2, ar: [4, 5, 6]}
 let ary = { a: f, b: g, ar: [t, y, u]} = obj
 console.log(ary)
   

解构赋值中的默认值

默认值为表达式时,惰性求值,先判断传入值是否为undefined,否时求表达式值

fn () { return 3 }
let [a = fn()] = [1] ==>  a = 1
let [a = fn()] = [] ==>  a = 3

if([1][0] === undefined){
	return a = fn()
   } else {
   	return a = [1][0]
}   

值得注意,null !== undefined

let [ a = 3 ] = [ null ] ==> a = null

默认值可以引用其他变量,但必须已声明,当后者引用前者变量时,前者变量改变,后者值随之改变

let [ a = 1, b = a ] = []  ==> a = 1, b = 1
let [ a = 1, b = a ] = [2]  ==> a = 2, b = 2
let [ a = 1, b = a ] = [2, 3]  ==> a = 2, b = 3
let [ a = b, b = 1] = []  ==> 报错

数组本质是特殊的对象

let arr = [1,2,3]
let {0 : 99, arr.length - 1 : 199} = arr

解构赋值中使用()的情况

赋值语句中对关于值的部分
const { a: (b) } = { a: 13 }
[(b)] = [9]
[(paras.pageIndex)] = [3]