js手动实现watch

在JavaScript中手动实现watch（观察）功能，我们可以利用Object.defineProperty方法来实现。

首先，我们定义一个目标对象target和一个观察对象observer。目标对象是我们要观察的对象，观察对象是用来观察目标对象属性变化的对象。

然后，我们使用Object.defineProperty方法给目标对象的属性添加getter和setter函数，这样当目标对象的属性被获取或者设置时，就会触发对应的getter和setter函数。

观察对象中我们可以定义一个监听函数，这个函数用来处理目标对象属性变化时的行为。在监听函数中我们可以执行我们需要的操作，如打印变化的值、更新其他相关属性等。

下面是一个简单的代码示例：

// 目标对象
const target = {
  name: '小明',
  age: 18
};

// 观察对象
const observer = {
  // 监听函数
  watch: function(property, handler) {
    let value = target[property];
    Object.defineProperty(target, property, {
      get: function() {
        return value;
      },
      set: function(newValue) {
        value = newValue;
        handler(newValue);
      }
    });
  }
};

// 监听name属性的变化
observer.watch('name', function(newName) {
  console.log('姓名变为：', newName);
});

// 修改name属性值
target.name = '小红';

运行以上代码，当我们修改目标对象的name属性值时，就会触发监听函数，打印出新的属性值。这样我们就实现了手动实现watch功能。