什么是解构?
ES6 允许按照一定模式,从数组和对象中提取值,对变量进行赋值,这被称为解构。
案例:
// 赋值
let {x}={x:1} // x的值为1
// 赋值对象
let {x}={x:{y:1}} // x的值{y: 1}
// 按照模式赋值
let {x:z}={x:2} // x is not defined ;z的值为2
let {x:{y}}={x:{y:1}} //x is not defined ;y的值为1;
解构在函数中主要应用
1.取出函数(对象)中的方法或者值:
function School(){
this.address="山东"
this.show=()=>{
console.log(this.address,'学汽修那家强?')
}
}
let {show,address}=new School();
show(); // 山东 学汽修那家强?
console.log(address) // 山东
2.作为函数的默认值:
// 方式1
function f1({x,y=3}){
console.log(x,y);
}
f1() // 报错 相当于 let {x,y=3}=undefined
f1({x:2}) // 2 3 相当于 let {x,y=3}={x:2}
f1({}) //undefined 3 相当于 let {x,y=3}={}
// 方式2 相当于给了解构一个默认值{}
function f2({x,y=3}={}){
console.log(x,y);
}
f2(); // undefined 3 相当于 let {x,y=3}={}
f2({x:2}) // 2 3 相当于 let {x,y=3}={x:2}
//方式3
function f3({x,y}={x,y:3}){
console.log(x,y);
}
f3(); // 报错 相当于 let {x,y}={x,y:3} x不存在报错
f3({x:2}) //2 undefined let {x,y}={x:2}
f3({}) // undefined undefined let {x,y}={}
3.多个返回值
function f1(){
return [1,2,3];
}
let [x,y,z]=f1(); // x=1;y=2;z=3;