编程语言
首页 > 编程语言> > javascript-对解构函数参数感到困惑

javascript-对解构函数参数感到困惑

作者:互联网

在下面的示例中,whois()函数为什么可以访问displayName2和name1?

function whois({displayName: displayName2, fullName: {firstName: name1}}){
  console.log(`${displayName2} is ${name1}`)
}

let user = {
  displayName: "jdoe",
  fullName: {
      firstName: "John",
      lastName: "Doe"
  }
}
whois(user) // "jdoe is John"

对未经训练的人来说,它似乎应该可以访问displayName和fullName.firstName.相反,解构看起来像JSON.

到底发生了什么事?

解决方法:

displayName和firstName分别为assigned new names-displayName2和firstName1可以接受,要访问这些值,您需要使用别名.

由于仅将别名定义为变量,因此尝试使用旧名称访问值将引发“未定义变量”错误.

const destructure1 = ({ a: aa }) => console.log(aa);
destructure1({ a: 5 }); // gets the value

const destructure2 = ({ a: aa }) => console.log(a);
destructure2({ a: 5 }); // throw an error because a is not defined

此外,在对computed property names使用解构时,必须将其分配给新的变量名称:

const prop = 'a';

const destructure1 = ({ [prop]: aa }) => console.log(aa);
destructure1({ a: 5 }); // gets the value

标签:destructuring,javascript,ecmascript-6
来源: https://codeday.me/bug/20191011/1891705.html