昨天简单看了并且了解了数组的解构赋值,今天进一步看一下对象的解构赋值,并逐渐深入看一些复杂的对象结构赋值是怎么样子的!!!
先来看一个简单的对象,我们进行解构!
let obj = {
a: 1,
b: 2
}
//解构对象中的变量
let {a,b}=obj;
console.log("a="+a+" "+"b="+b);//打印出结果a=1,b=2
上述是一个简单的对象解构变量实例,下面进一步看一些结构对象中变量的拓展,当结构不存在的变量会是怎么样的情形呢?
let obj = {
a: 1,
b: 2
}
//不存在的对象提示undefined
let { c, b } = obj
console.log("c:" + c); //由于对象中不存在c,返回undefined
如果想将对象中的变量重命名该如何操作?
let obj = {
a: 1,
b: 2
}
//获取到a或者b重命名在ES5下应该是这样的
var A=obj.a;//将对象中a重新赋值给A
//在ES6解构中就是很简单了
let {a:A,b}=obj;//这样A=obj中的a了,冒号表示重新赋值给后面的变量名
//那么原来的表示什么呢
let {a,b}=obj 相当于 a=obj.a b=obj.b了在对应的对象中找到相应的去赋值
对应已经存在的变量如何进行解构赋值呢?
let obj = {
a: 1,
b: 2
}
let a = 0;
console.log("a:" + a);
// {a,b}=obj;重新赋值提示语法错误,表示变量a已经存在,这个不是一个代码块,只是语法解构
//但是被默认当做代码块
({a,b}=obj);//外加括号包围,表示这是一个语法解构就ok
看一下较为复杂的对象解构化.
//声明一个复杂的对象
let obj={
arr:[
'Y.o',
{
a:1,
b:2,
c:3
},
]
}
let {arr:[str,{a,b,c}]}=obj;
再看一个更为复杂的对象,进行解构
let sts={
name:"小米",
test:"期末考试",
add:['河南省','北京','上海','天津','云南','贵州'],
days:{
desc:"这是一天",
time:"00:00",
sort:['上午','中午','下午']
}
}
let {name,test,add:[a,b,c,d],days:{dc,time,sort:[top,mid,bot]}}=sts;
总结:对于嵌套的对象(对象的中变量又是一个对象),解构的时候加冒号使用基础的{}进行嵌套结构,嵌套的如果是数组就嵌套解构数组(使用中括号)的方式嵌套结构.一般遇到的数据不会这么复杂的,对象的结构赋值大概就这样,如有问题请留言谢谢!