Question

我正在定义一个对象，我想用它的另一个属性来计算它的一个属性。

// first the calculation function
const calculateArea = (height, width) => {
   return height * width
}

// then the object itself...
const myObj = {
   height: 20,
   width: 10,
   area: calculateArea(this.height, this.width)
}

我以为我可以使用this.height和this.width来访问我定义的对象中的属性，但是我得到了

无法阅读＆＃39;身高＆＃39;未定义的

我哪里出错了，解决方案是什么？

Answer 1

问题是，您尝试使用此引用您的对象，但它并不存在。您引用的此可能是未定义（如您的情况），这会导致＆＃34;无法读取未定义的＆＃34;的X属性。错误。

但是 this 可能会绑定到上下文中的另一个对象，具体取决于具体情况。在这种情况下，您不会接受此错误，并且与绑定对象相对应的值将以此的形式返回。

尝试从检索到的此对象中获取值可能会导致2种情况，这两种情况都不是您想要的。

检索到的此具有宽度和高度属性，因此您的函数将获取这些值并相应地计算结果。但是这些值不会是您在对象中传递的值。
检索到的此没有宽度或高度属性，因此您的函数将未定义< / strong>作为参数，会相应地给出错误。

有很多方法可以解决这个问题。这是我的主张：

这里的主要问题是，在构建对象时，急切地计算区域的值。冻结该计算并在创建对象后触发它将计算对象中的正确值。

// first the calculation function const calculateArea = (height, width) => { return height * width } // then the object itself... const myObj = { height: 20, width: 10, // init, is a function that uses bounded context's width, height init: function() { this.area = calculateArea(this.height, this.width); delete this.init; // We don't want init in our result object return this; } }.init();

现在，当我们调用对象的init（）时，我们将 this 指向正确的对象。它将使用 this.width 和 this.height 计算区域。它还将从结果对象中删除init（）函数，并按照您想要的形式返回对象。

我们暂停计算，让我们的 this 指向正确的上下文然后继续。

Answer 2

怎么样：

function myObj(height, width) {
  this.height = height;
  this.width = width;
  this.area = calculateArea(height, width);
}

let obj = new myObj(20, 10);

使用另一个属性

2 个答案: