如何让构造函数创建的对象中依赖其他属性的属性值正确更新？

问题原因 #

代码中的bar是实例化阶段就完成计算的静态属性，仅在执行new foo()时会用当时传入的a、b参数运算一次并固定值，后续修改实例的a、b属性不会触发重新计算。你实例化时没有传入参数，undefined + undefined得到的NaN就被一直保存在bar属性中，修改a、b后也不会更新。

解决方案 #

将bar定义为getter访问器属性即可，每次访问bar时都会实时读取当前的a、b值计算结果，同时可以保证foo构造函数生成的多个实例互相独立：

function foo(a, b) {
    this.a = a;
    this.b = b;
    // 定义bar为访问器属性
    Object.defineProperty(this, 'bar', {
        get: function() {
            return this.a + this.b;
        },
        enumerable: true // 保持可枚举性，和原有属性行为一致
    });
}

var z = new foo();
z.a = 2;
z.b = 3;
console.log(z.bar); // 输出5

如果是ES6环境，也可以用类语法实现，写法更简洁：

class Foo {
    constructor(a, b) {
        this.a = a;
        this.b = b;
    }
    get bar() {
        return this.a + this.b;
    }
}

const z = new Foo();
z.a = 2;
z.b = 3;
console.log(z.bar); // 输出5

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