函数参数解构赋值

Posted 2021-03-18 shyno

解构赋值运用到函数参数上,减少了一些操作同时也增加了一些麻烦.

1.函数参数

let a={name:‘小明‘,age:18}
function wuKongYouLook(b){
console.log(b)
}
wuKongYouLook(a)//{name:‘小明‘,age:18}
wuKongYouLook() //undefined

 

我们可以理解成函数在声明的时候,如果有一个形参b,则在调用的时候声明了一个局部变量b,所以即使没有传参,也只是没有值,即undefined.

而传实参,则相当于又多了个b=a这个赋值的过程,所以函数后续的代码虽然使用变量b,但实际在操作a的值.

2.形参默认值

let a={name:‘小明‘,age:18}
function wuKongYouLook(b={}){
console.log(b)
}
wuKongYouLook(a)//{name:‘小明‘,age:18}
wuKongYouLook() //{}　

 

也就是说,当b=a这一步失败时,则b取其默认值.这一点很重要　

 

3.函数参数解构赋值

let a={name:‘小明‘,age:18}
    function wuKongYouLook({name,age}){
      console.log(name,age)
      }
      wuKongYouLook(a)//小明,18
      wuKongYouLook() //报错　　
//这里实际上是省略了一步,let {name,age} =a;即 let 形参 = 实参,所以就可以打印出name,age的值.而不给参数或者参数是undefined时,let {name,age}=null或者undefined都会报错　

故,我们需要给个默认值

let a={name:‘小明‘,age:18}
    function wuKongYouLook({name,age}={}){
      console.log(name,age)
      }
      wuKongYouLook(a)//小明,18
      wuKongYouLook() //undefined,undefined
//同理,当let {name,age} =null或者undefined时,系统要报错,但是这时它发现参数有默认值,于是就变成了let {name,age} = {},空对象是可能有name属性的,那就没错,去找找看,没有,那就返回undefind.　

　　

设置几种默认值的陷阱,很容易出错

(1)形参整体设置默认值

上面那个例子就是,在等号的右边设置想要的默认值

let a={name:‘小明‘,age:18}
    function wuKongYouLook({name,age}={name:‘shyno‘,age:18}){
      console.log(name,age)
      }
      wuKongYouLook(a)//小明,18                       let {name,age}={name:‘小明‘,age:18}
      wuKongYouLook({name:‘小红‘}) //小红,undefinded  let {name,age} = {name:‘小红‘}
      wuKongYouLook({})    //undefined,undefined     let {name,age} = {}
      wuKongYouLook() //shyno,18                     let {name,age} = {name:‘shyno‘,age:18}　

原理还是一样,先看看有没有实参.除了最后一次调用,都有实参.所以,只有最后一次打印了默认值,即{name:‘shyno‘,age:18}.其他的都是解构了实参

(2)形参解构赋值时设置默认值

let a={name:‘小明‘,age:18}
    function wuKongYouLook({name=‘shyno‘,age=17}={}){
      console.log(name,age)
      }
      wuKongYouLook(a)//小明,18                       let {name=‘shyno‘,age=17} = {name:‘小明‘,age:18}
      wuKongYouLook({name:‘小红‘}) //小红,17         　let {name=‘shyno‘,age=17} = {name:‘小红‘}
      wuKongYouLook({})    //shyno,17                 let {name=‘shyno‘,age=17} = {}
      wuKongYouLook() //shyno,17                     let {name=‘shyno‘,age=17} = null或者undefined