JavaScript中对象属性bmi显示undefined的原因咨询

你编写的JavaScript代码如下：

const markMiller = {
  firstname: 'Mark',
  secondName: 'Miller',
  mass: 78,
  height: 1.69,
  calcbmi: function () {
    this.bmi = this.mass / this.height ** 2;
    return this.bmi;
  },
};
const johnSmith = {
  firstname: 'john',
  secondName: 'Smith',
  mass: 92,
  height: 1.95,
  calcbmi: function () {
    this.bmi = this.mass / this.height ** 2;
    return this.bmi;
  },
};
console.log(typeof (johnSmith.bmi))
console.log(markMiller);

执行后johnSmith.bmi类型为undefined，markMiller里也没有bmi属性，原因很简单：你没有调用过calcbmi()方法。

对象里的calcbmi方法是用来计算并给自身添加bmi属性的，但你只定义了这个方法，从来没执行它。也就是说this.bmi = ...这行赋值代码根本没运行过，对象自然不存在bmi这个属性，访问它的时候就会返回undefined——哪怕用[]语法访问johnSmith['bmi']结果也是一样，因为属性本身就没被创建出来。

要解决这个问题，只需要先调用两个对象的calcbmi()方法：

// 先调用方法，触发bmi属性的创建和赋值
markMiller.calcbmi();
johnSmith.calcbmi();

console.log(typeof johnSmith.bmi); // 输出 "number"
console.log(markMiller); // 控制台会显示包含bmi属性的对象

内容的提问来源于stack exchange，提问作者Kaiser