英文原文：http://emberjs.com/guides/object-model/computed-properties/

什么是计算属性？

简单地来说，计算属性就是将函数声明为属性。通过定义一个如同函数一般的计算属性，Ember将会自动调用该函数来获取计算属性的值，此后就可以如同使用普通静态属性一样来使用计算属性。

在需要使用一个或者多个属性的变形，或者手动修改其数据的时候非常有用。

计算属性实操

下面就从一个简单的例子开始：

  1. App.Person = Ember.Object.extend({
  2.   // these will be supplied by `create`
  3.   firstName: null,
  4.   lastName: null,
  6.   fullName: function() {
  7.     return this.get('firstName') + ' ' + this.get('lastName');
  8.   }.property('firstName', 'lastName')
  9. });
  11. var ironMan = App.Person.create({
  12.   firstName: "Tony",
  13.   lastName:  "Stark"
  14. });
  16. ironMan.get('fullName') // "Tony Stark"

注意这里fullName函数是property。这里将函数声明为计算属性，参数则是告诉Ember，fullName依赖于firstName和lastName两个属性。

当访问fullName属性时，函数将被调用，并返回函数的返回值。上例中则是将firstName和lastName拼接起来。

链式计算属性

计算属性又可以用来定义新的计算属性。下面将使用fullName属性和其他的一些新加的属性，给上例添加一个description计算属性。

  1. App.Person = Ember.Object.extend({
  2.   firstName: null,
  3.   lastName: null,
  4.   age: null,
  5.   country: null,
  7.   fullName: function() {
  8.     return this.get('firstName') + ' ' + this.get('lastName');
  9.   }.property('firstName', 'lastName'),
  11.   description: function() {
  12.     return this.get('fullName') + '; Age: ' + this.get('age') + '; Country: ' + this.get('country');
  13.   }.property('fullName', 'age', 'country')
  14. });
  16. var captainAmerica = App.Person.create({
  17.   firstName: 'Steve',
  18.   lastName: 'Rogers',
  19.   age: 80,
  20.   country: 'USA'
  21. });
  23. captainAmerica.get('description'); // "Steve Rogers; Age: 80; Country: USA"

动态更新

计算属性默认情况下会监听所有其依赖的属性的变化，并在其被调用的时候进行更新。下面将使用动态属性的动态更新。

  1. captainAmerica.set('firstName', 'William');
  3. captainAmerica.get('description'); // "William Rogers; Age: 80; Country: USA"

这里firstName的改变被fullName计算属性观测到，而fullName的改变又被description计算属性观测到。

设置任意依赖的属性导致的改变，将按照创建的计算属性链，一路向下传播，到所有依赖他们的计算属性。

设置计算属性

计算属性可以定义其在被设置的时候Ember需要做些什么工作。如果尝试设置一个计算属性，需要在调用的时候传入键值（属性名），以及将被设置的值。

  1. App.Person = Ember.Object.extend({
  2.   firstName: null,
  3.   lastName: null,
  5.   fullName: function(key, value) {
  6.     // setter
  7.     if (arguments.length > 1) {
  8.       var nameParts = value.split(/\s+/);
  9.       this.set('firstName', nameParts[0]);
  10.       this.set('lastName',  nameParts[1]);
  11.     }
  13.     // getter
  14.     return this.get('firstName') + ' ' + this.get('lastName');
  15.   }.property('firstName', 'lastName')
  16. });
  18. var captainAmerica = App.Person.create();
  19. captainAmerica.set('fullName', "William Burnside");
  20. captainAmerica.get('firstName'); // William
  21. captainAmerica.get('lastName'); // Burnside

Ember在设置或者获取的时候都将调用计算属性，因此如果需要定义一个计算属性的设置器时，需要通过判断传入的参数的数量来判断是设置还获取。需要注意的是，如果设置器具有返回值，该值将作为属性的值进行缓存。