Ember 计算属性与 Ember 观察者

Question

我在这里看到的之前的问题似乎都没有涉及何时使用 Ember Computed Property 与 Ember Observer 的主题。我了解计算属性使用以前的属性来帮助生成新属性并在运行循环中更新。

Person = Ember.Object.extend({
  // these will be supplied by `create`
  firstName: null,
  lastName: null,

  fullName: Ember.computed('firstName', 'lastName', function() {
    return `${this.get('firstName')} ${this.get('lastName')}`;
  })
});

另一方面，观察者在运行循环之外进行更新，并且可以观察任何东西，甚至是计算属性。它会对任何类型的变化做出反应。

Person = Ember.Object.extend({
  // these will be supplied by `create`
  firstName: null,
  lastName: null,

  fullName: Ember.computed('firstName', 'lastName', function() {
    return `${this.get('firstName')} ${this.get('lastName')}`;
  }),

  fullNameChanged: Ember.observer('fullName', function() {
    // deal with the change
    console.log(`fullName changed to: ${this.get('fullName')}`);
  })
});

Ember 文档随后指出，观察者通常被过度使用。有人可以举一个更好的例子来说明正确使用观察者吗？他们还能看什么，不正确使用与正确使用的影响是什么？

源代码可以在 ember 文档中找到：https://guides.emberjs.com/v2.3.0/object-model/observers/

Answer 1

Computed Property 使用以前的属性来帮助生成新属性并在运行循环中更新

是的，但是懒惰地——意味着只有在被引用时，和它们的依赖关系发生了变化，才会使缓存的值失效。

Ember 文档随后指出，观察者通常被过度使用。

是的，只要被监视的属性发生变化，观察者就会同步触发，即使原因是重新计算不会使用的东西。对应该计算的属性使用观察者是经典的 Ember 反模式之一。

我检查了我处理过的几个大型应用程序，发现观察者被用于在某些事情发生变化时根据需要调用某些第三方库，或者在选择新的 UI 语言时更改应用程序的语言。