为什么 Object.observe() 不给回调提供变化的数据路径？

Question

Object.observe() 回调的更改数组包含具有以下四个属性的对象：

• 姓名
• 对象
• 类型
• 旧值

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/observe#Parameters

为什么本地没有提供path？示例：

var ob = {
    foo: [
        {moo: "bar", val: 5},
        {val: 8}
    ]
}

ob.foo[0].val = 1;
// callback should provide path "foo.0.val" or "foo[0].val"

有一个 Node.js 模块扩展了 Object.observe() 以包含路径：observed.js，
但我担心原生observe() 的性能提升会丢失（如果没有，您能否解释一下它是如何实现的？）。 browserify 模块可能是可能的，但无法想象它会在同步环境中表现良好，我仍然想知道为什么似乎没有人考虑额外的 path 属性。

Answer 1

因为没有明确的道路。

考虑以下几点：

var movall = {moo: "bar", val: 5};
var ob1    = {a: mooval};
var ob2    = {b: movall};

现在假设我观察到movall。然后我更新moo。路径是什么？是movall.moo，还是ob1.a.moo，还是ob2.b.moo？如果我观察ob1，则没有报告任何更改，因为它的任何属性都没有更改（更改是内部对其属性之一，这不算数）。

对象独立于嵌套在其他对象中的存在。它们可以嵌套在多个其他对象中。没有唯一的“路径”来描述如何从可能的多个起点到可能已更改的特定属性。

JS 也不知道您到达被更改属性的路径。所以在ob.foo[0].val = 1; 中，JS 只是评估链，到达foo[0] 对象，更改它的val 属性，此时不知道它是如何到达foo[0] 的。它只知道foo[0] 已经改变。它在 ob 中发生了变化，但它也可能在恰好具有 foo[0] 作为属性的其他对象中发生了变化。

但是，您可以通过在低级观察/通知机制之上构建一些机制来实现您似乎想要实现的目标。我们将在对象上定义一个函数，该函数在其属性对象上设置观察者，以此类推，并使用正确构造的路径将更改记录传播回来：

function notifySubobjectChanges(object) {
  var notifier = Object.getNotifier(object);        // get notifier for this object
  for (var k in object) {                           // loop over its properties
    var prop = object[k];                           // get property value
    if (!prop || typeof prop !== 'object') break;   // skip over non-objects
    Object.observe(prop, function(changes) {        // observe the property value
      changes.forEach(function(change) {            // and for each change
        notifier.notify({                           // notify parent object
          object: change.object,                    // with a modified changerec
          name: change.name,                        // which is basically the same
          type: change.type, 
          oldValue: change.oldValue, 
          path: k + 
            (change.path ? '.' + change.path : '')  // but has an addt'l path property
        });
      });
    });
    notifySubobjectChanges(prop);                   // repeat for sub-subproperties
  }
}

（注意：change 对象已冻结，我们无法向其中添加任何内容，因此我们必须复制它。）

现在

a = { a: { b: {c: 1 } } };                     // nested objects
notifySubobjectChanges(a);                     // set up recursive observers
Object.observe(a, console.log.bind(console));  // log changes to console
a.a.b.c = 99;

>> 0: Object
  name: "c"
  object: Object
  oldValue: 1
  path: "a.b"                                  // <=== here is your path!
  type: "update"

以上代码不是生产质量，使用风险自负。