Javascript 更改getter/设置时运行代码

我可以使用getter/setter对观察者执行类似的任务吗

例如，如果我将一个getter/setter实例分配给多个对象，这些对象都将是引用，那么如果任何一个对象导致getter更改，那么相同的代码将正常运行

我尝试了以下代码：

var obj = {
  value: null,
  get val() {
    return this.value;
  },
  set val(x) {
    console.log('set');
    if (this.value !== x) {
      console.log('value has been changed, do stuff!');
    }
    this.value = x;
  }
}
var one = {
  name: 'object 1',
  value: obj /* Reference object */
}
var two = {
  name: 'object 2',
  value: obj /* Reference object */
}
var three = {
  name: 'object 3',
  value: obj /* Reference object */
}

然后运行

one.value.value=2

，它将触发控制台日志。但是，我只在控制台中获得

2

输出，没有console.log

编辑

刚刚看到哪里出了问题，我应该做

one.value.val=2

，这开始起作用了，等等

编辑2

不太确定这是否会像我期望的那样起作用。我要试着把我要做的事情分解掉

我得到了一组对象，如下所示：

var images = [ 
  { index: 0, object: HTMLElement, src: String, active: Object, alt: String },
  { index: 1, object: HTMLElement, src: String, active: Object, alt: String },
  { index: 2, object: HTMLElement, src: String, active: Object, alt: String },
  { index: 3, object: HTMLElement, src: String, active: Object, alt: String },
  { index: 4, object: HTMLElement, src: String, active: Object, alt: String },
  { index: 5, object: HTMLElement, src: String, active: Object, alt: String },
  { index: 6, object: HTMLElement, src: String, active: Object, alt: String } 
];

在我的脚本中，这个对象会被复制几次，但是活动状态需要在所有实例中保持不变

我如何复制对象：

var newList = [];
for (var i = 0; i < _.images.length; i++) {
   // Create new instances of the images
   var img = document.createElement('img');
   img.src = images[i].object.src;
   img.classList.add('responsive-img');
   img.alt = images[i].alt;

   var span = document.createElement('span');
   span.appendChild(img);

   if (i === current) img.parentNode.classList.add('active');

   var newImage = {
      object: img,
      index: i,
      src: images[i].src,
      active: images[i].active, // Use reference to old list
      alt: images[i].alt
   };
   newList.push(newImage);

   // Add each image to the gallery DOM
   _.gallery.main.appendChild(span);
}

然后

newList[0].object.classList.Add（'active'）和
图像[0]。对象。类列表。添加（'active'）执行

应该执行更多的代码，但是让我们一步一步地执行。我以前使用Polyfill作为Observer，但是对于我想做的事情来说，它太重了，而且过于夸张，在Internet Explorer上也有问题

我认为最好的方法可能是从
setter
进行某种回调，这样我就可以为该对象所在的每个实例运行唯一的代码
 感觉有点粗糙，但在active中添加一个getter来设置所引用的对象应该可以：


var活动={
_值：null，
对象：null，
设定值（v）{
_值=v；
this.object.style.display=v；
}
}
变量图像=[
{img:document.querySelector（'.div1'），_-active:active，get-active（）{this._-active.object=this.img；返回此。_-active}
},
{img:document.querySelector（'.div2'），_-active:active，get-active（）{this._-active.object=this.img；返回此。_-active}
}
]
图像[0]。active.value='none'；
图像[1]。active.value='block'
div1
div 2
您试过了吗？这里的问题是，如果您更改1.value，它也会更改2.value和3.value。如果这是您的意图，那么我是否应该尝试它？是的，但是它似乎没有显示console.log。是的@juvian这就是我的意图。@请看updateWell，您的setter用于val而不是value，one.value.val=2会运行代码
images[0].active.val = 1