JavaScript 构造函数中的 this = {} 表达式是什么意思？答案

【问题标题】：What does this = {} expression inside a constructor in JavaScript mean?JavaScript 构造函数中的 this = {} 表达式是什么意思？
【发布时间】：2020-09-11 21:18:34
【问题描述】：

谁能解释一下下面代码中的 ={} 表达式是干什么用的？

class Dragon {

    constructor({ birthdate, nickname, traits } = {}) {
        this.birthdate = birthdate || DEFAULT_PROPERTIES.birthdate;
        this.nickname = nickname || DEFAULT_PROPERTIES.nickname;
        this.traits = traits || DEFAULT_PROPERTIES.randomTraits;


    }
}

【问题讨论】：

{} 是参数（对象）的默认值
stackoverflow.com/questions/35526463/… 的可能重复项

标签： javascript object constructor

【解决方案1】：

Default value for the paremeter。构造函数将一个对象作为其唯一参数，如果您在没有任何参数的情况下调用该函数，则会给出一个空对象（即{}）作为参数

请注意，该函数仅接受 one 参数，尽管它可能看起来像 3，因为 object destructuring syntax

【讨论】：

【解决方案2】：

看下面的代码：

function sayHello(name){
  const nameToPrint = name || "Unknown"
  console.log('Hello' + nameToPrint)
}

sayHello('Tylor')
// Hello Tylor

sayHello()
//Hello Unknown

这个函数是一个完全有效的函数。 nameToPrint 的值要么是传入的名称，要么是 Unknown，以防未提供参数 name。

现在让我们稍微改变一下：

 function sayHello({name}){
      const nameToPrint = name || "Unknown"
      console.log('Hello' + nameToPrint)
  }

    sayHello('Tylor')
    // Hello Tylor

    sayHello()
    //Cannot destructure property 'name' of 'undefined' as it is undefined.

现在，如果未提供参数 name，该函数将引发错误。这是因为它会尝试从未提供的对象（AKA from undefined）中析构，这最终会导致错误。通过添加={}，我们为对象添加了一个默认值。所以现在，如果没有提供参数，它们将是未定义的（一个假值）；并且，这些参数的值将是后备参数（|| 之后的值）。

回到我们的例子：

function sayHello({name} = {}){

  const nameToPrint = name || "Unknown"
  console.log('Hello' + nameToPrint)
}

sayHello('Tylor')
// Hello Tylor

sayHello()
//It will try to extract the property name from object {}
// The value of name will be undefined, so the value of nameToPrint will be "Unknown"
//Hello Unknown

总而言之，尝试访问未定义的属性会触发错误，但尝试访问空对象的属性只会导致值未定义。 See this for more info

【讨论】：