第 43 题：如何使用 ES5、ES6 实现监听对象属性的改变？

利用 ES5 的 Object.defineProperty 实现

let student = {};
let age = undefined;

Object.defineProperty(student, 'age', {
    get: function() {
        // 获取该属性时触发
        return age;
    },
    set: function(val) {
        // 设置该属性值时触发

        age = val;
    }
});

student.age = 20;
console.log(student.age); // 20

利用 ES6 的 Proxy 实现

let student = new Proxy(
    {},
    {
        get: (obj, prop) => {
            // 获取该属性时触发

            return obj[prop];
        },
        set: (obj, prop, value) => {
            // 设置该属性值时触发

            obj[prop] = value;
            return true;
        }
    }
);

student.age = 20;

console.log(student.age); // 20

文章的内容/灵感都从下方内容中借鉴

• 【持续维护/更新 500+前端面试题/笔记】https://github.com/noxussj/Interview-Questions/issues

• 【大数据可视化图表插件】https://www.npmjs.com/package/ns-echarts

• 【利用 THREE.JS 实现 3D 城市建模（珠海市）】https://3d.noxussj.top/