解构赋值:解析数据源 然后按照数据模型进行取值 再赋值给变量
声明变量的高级写法
变量修饰符 数据模型=数据源
解构 按照数据模型取出数据源中的数据 赋值:然后赋值给模型变量
let obj={a:100,b:"hello",c:[10,203,0]}
let {a,b,c}=obj
隐式操作: let a=obj.a; let b=obj.b; let c=obj.c
console.log(a)
console.log(b)
console.log(c)
{a,b,c}相当于三个变量 这个变量名必须和obj中的键值相同 不然不能匹配
数据模型除了有对象模型也就只有数组模型
arr=[10,20,30]
let [a,b,c]=arr
数组模型解构就不用保证他的变量名相同 因为数组是通过下标一次赋值的
var [name,{age}]=arr;
隐式操作: var name=arr[0]
var age=arr[1].age
当然我们也可以嵌套
let obj={age:20}
let {age,name1}=obj
console.log(age,name1)
没有name1,但是不会报错,因为我们说过let可以声明但不赋值
let [{age,its:[a,{b}]}]=data
let its=data[0].its
let a=its[0]
let b=its[1].b
console.log(its)
前面我们都是赋值的基本数据
那么引用数据又该怎么解构赋值呢?
let [{age,its:[a,{b}]}]=data
我们分解这一步声明了一个数组模型里面嵌套了个对象模型,对象模型里面有两个属性age和its
its是一个引用数据--数组,这就涉及到二次解构使用冒号:如果是数组就用[]如果是对象就用{}
但是注意最后打印的时候its是无法打印,我们没有定义its变量,我们只是通过its找到里面的变量,its只是一个中间量,他没有声明,所以无法打印
console.log(sinadata)
for(let i=0;i<sinadata.statuses.length;i++){
let {text,created_at,ab_switcher,alchemy_params:{comment_guide_type,ug_red_envelope}}=sinadata.statuses[i]
// let {comment_guide_type,ug_red_envelope}=alchemy_params
console.log(comment_guide_type)
}
这也是一个大型数据的解构赋值
alchemy_params用了两种方法去解构赋值
//是另外一种二次解构 分层解构
但最终的效果是一样的