如何在javascript中将eventListener添加到对象被操作时将触发的对象？答案

【问题标题】：how to add an eventListener to an Object in javascript which will fire when object is manipulated?如何在javascript中将eventListener添加到对象被操作时将触发的对象？
【发布时间】：2011-04-23 15:01:00
【问题描述】：

我有一个动态操作的复杂 UI 结构，我说我有一个 ui_state 对象，我在其中保存用户的最新 UI 状态，例如可见的选项卡、选项卡内的内容等。

例如：

var ui_states = {
  tabs : [
    {
      name     : "some tab",
      active   : true,
      children : { ... }
    },
    {
      name     : "some other tab",
      children : { ... }
    }
  ]
}

我将其保留在html5 localStorage 上，当用户刷新站点时，它会重新打开相同的页面。每次 UI 更改时，此对象都会相应更改。就在改变它之后，我需要运行让我们说updateLocalStorage()，它工作得很好。

我的问题是这个流程，我可以为我的ui_states 对象创建一个自定义事件，比如ui_states.addEventListener('onchange', function(){ // do stuff })，以便在我每次操作对象时不运行updateLocalStorage() 函数吗？

谢谢。

【问题讨论】：

标签： javascript events javascript-events event-handling

【解决方案1】：

您将 JavaScript 编程与 DOM 编程混为一谈。事件纯粹是一个 DOM 概念。 JS 对象不支持事件处理程序。

唯一的方法是创建 getter 和 setter。 special properties 有一些方法可以做到这一点，但不幸的是，浏览器支持可能有点。另一种方法是使用显式方法和私有变量。 This is possible but a little complex.

【讨论】：

我不同意。事件绝对不仅仅是 DOM。但是一个松散耦合组件的概念，也可以在“Dom-Less”-JS 中实现。
是的，他可能混合了这两个概念，但是是的，一些纯 javascript 对象支持 XMLHTTPRequest、RTCConnection、Worker、WebSocket 等事件......为了完成我的评论，没有 Object 对象不支持事件除了（最近）使用 Object.observe（仅适用于 Chrome）。
好的，当我发布这个答案时，事件确实只在 DOM 对象上。显然，从那时起事情就向前发展了。