Ember学习（6）：Observers

英文原址：http://emberjs.com/guides/object-model/observers/

Ember支持监听任何属性，包括计算型属性。你可以通过对函数使用observes来针对一个对象创建observer。

Person = Ember.Object.extend({  // these will be supplied by `create`  firstName: null,  lastName: null,  fullName: function() {    var firstName = this.get('firstName');    var lastName = this.get('lastName');    return firstName + ' ' + lastName;  }.property('firstName', 'lastName'),  fullNameChanged: function() {    // deal with the change  }.observes('fullName').on('init')});var person = Person.create({  firstName: 'Yehuda',  lastName: 'Katz'});person.set('firstName', 'Brohuda'); // observer will fire

因为fullName计算型属性依赖firstName属性，更新firstName也会触发fullName的observer。

观察者和异步

目前Ember中Observer都是同步的，这意味着observer方法会在他们观察的属性被改变的当时就被触发，因为这个原因，当属性不是同步方式使用时，容易引入一些bug。

Person.reopen({  lastNameChanged: function() {    // The observer depends on lastName and so does fullName. Because observers    // are synchronous, when this function is called the value of fullName is    // not updated yet so this will log the old value of fullName    console.log(this.get('fullName'));  }.observes('lastName')});

上面的observer依赖lastName，也需要调用fullName。因为observer是同步的，当这个函数被调用时，fullName的值还没有来得及更新，因此它会打印出fullName的旧值。

这种同步的机制也会导致同一个observer被触发多次，当这个observer同时监听多个属性时。

Person.reopen({  partOfNameChanged: function() {    // Because both firstName and lastName were set, this observer will fire twice.  }.observes('firstName', 'lastName')});person.set('firstName', 'John');person.set('lastName', 'Smith');

为了避免这样的问题，你应该使用Ember.run.once。这会保证任何你需要做的事情只会被执行一次，当所有绑定都是同步方式时，只在下一次run loop中发生一次。（这里还是有点不太理解，没有使用过，回头理解的更透彻了，再细说）

Person.reopen({  partOfNameChanged: function() {    Ember.run.once(this, 'processFullName');  }.observes('firstName', 'lastName'),  processFullName: function() {    // This will only fire once if you set two properties at the same time, and    // will also happen in the next run loop once all properties are synchronized    console.log(this.get('fullName'));  }});person.set('firstName', 'John');person.set('lastName', 'Smith');

观察者和对象初始化

只有一个对象的初始化完成了后，observer才会被触发。如果你需要observer在初始化发生时也被触发，你不能依赖set方法的副作用，你需要使用.on('init')来说明这个observer在初始化时也需要被触发。

App.Person = Ember.Object.extend({  init: function() {    this.set('salutation', "Mr/Ms");  },  salutationDidChange: function() {    // some side effect of salutation changing  }.observes('salutation').on('init')});

没有被调用的计算型属性不会触发观察者

如果你从来没有对一个计算型属性使用get方法，它的observer永远也不会被触发，即使是该计算型属性依赖的属性发生了变化。你可以想象成它的值从一个unknown值变成另外一个。

这通常都不会影响应用的代码，因为计算型属性通常基本上被观察的同时也会被访问。举个例子，你访问了一个计算型属性的值，将它插入了HTML DOM（或者使用D3画出来），然后你监听它，当它改变时，你可以更新DOM。

如果你需要监听一个计算型属性，但是却不马上读取该计算型属性，你可以在init方法中读取它。

不使用Prototype扩展

如果你没有使用Ember的Prototype扩展，那么你可以使用Ember.observer方法来定义observer：

Person.reopen({  fullNameChanged: Ember.observer('fullName', function() {    // deal with the change  })});

在类定义外面使用

你也可以在一个类定义的外面通过使用addObserver方法来给某个对象添加observer：

person.addObserver('fullName', function() {  // deal with the change});