解构赋值
1.数组
let [a, b, c] = [12, 5, 6] //右边是数据,左边是解构 cosole.log(a,b,c) //12 5 6
let [a,b,c] = [12,[5,6]]; //右边是你的数据,左边是你的解构 console.log(a,b,c); // 12, [5,6], undefined //如果希望数据对应,则需要结构一样 let [a,[b,c]] = [12,[5,6]]; console.log(a,b,c); //12 5 6 let [foo, [[bar], baz]] = [1, [[2], 3]]; foo // 1 bar // 2 baz // 3 let [ , , third] = ["foo", "bar", "baz"]; third // "baz" let [x, , y] = [1, 2, 3]; x // 1 y // 3
关于默认值:
let [a,b,c = "暂无数据"] = ["aa","bb"]; console.log(a,b,c); //aa bb 暂无数据 // 如果有值,就使用后台的值 let [a,b,c = "暂无数据"] = ["aa","bb","cc"]; console.log(a,b,c); // aa bb cc // 如果后台穿过来的是undefined,还是表示没有值,用默认值, let [a,b,c = "暂无数据"] = ["aa","bb",undefined]; console.log(a,b,c); //aa bb 暂无数据 // 如果后台传过来的是一个null,表示有值,null表示一个空对象 let [a,b,c = "暂无数据"] = ["aa","bb",null]; console.log(a,b,c); //aa bb null
不完全结构:
let [x, y] = [1, 2, 3]; x // 1 y // 2 let [a, [b], d] = [1, [2, 3], 4]; a // 1 b // 2 d // 4 //上面两个例子,都属于不完全解构,但是可以成功。
2.对象
let json = { name: "doudou", age: 18, sex: "男" } let {name,age,sex} = json; console.log(name,age,sex); // doudou 18 男
// 这里解构的属性名必须和对象的属性名相同,否则解不出来就全是undefined let {nam,ag,se} = json; console.log(nam,ag,se); // undefined undefined undefined
// 如果想自己定义更改属性名可以如下操作 let {name:nam,age:ag,sex:se} = json; // 这样依然可以改属性名,并打印了解构的值 console.log(nam,ag,se); //doudou 18 男
解构可用于嵌套结构
let obj = { p: [ 'Hello', { y: 'World' } ] }; let { p: [x, { y }] } = obj; x // "Hello" y // "World"