ember属性和javascript链接

时间:2013-03-04 15:37:06

标签: javascript ember.js

查看ember.js文档(http://emberjs.com/guides/object-model/computed-properties/)我理解如何使用属性,但之前没有在对象声明中运行链式方法。

在我看来,应立即调用property方法,但似乎并非如此。

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')
});

var tom = Person.create({
  firstName: "Tom",
  lastName: "Dale"
});

tom.get('fullName') // "Tom Dale"

如果我制作一个小js片段,这里似乎什么也没做。 http://jsfiddle.net/xXStr/

var a = {
    what: function() {
        alert ("oh yeah");
    },
    bar: function() {
        alert ("bar");
        return this;
    }.what()
}
a.bar();

对象声明中的链式方法如何工作?

1 个答案:

答案 0 :(得分:1)

如果查看Ember source内部,您会发现Function原型已扩展为包含property方法。

Function.prototype.property = function() {
  var ret = Ember.computed(this);
  return ret.property.apply(ret, arguments);
};

Looking deeper,我们看到Ember.computed返回Ember.Computed的实例。

Ember.computed = function(func) {
  var args;

  if (arguments.length > 1) {
    args = a_slice.call(arguments, 0, -1);
    func = a_slice.call(arguments, -1)[0];
  }

  var cp = new ComputedProperty(func);

  if (args) {
    cp.property.apply(cp, args);
  }

  return cp;
};

// ...

function ComputedProperty(func, opts) {
  this.func = func;
  this._cacheable = (opts && opts.cacheable !== undefined) ? opts.cacheable : true;
  this._dependentKeys = opts && opts.dependentKeys;
}

Ember.ComputedProperty = ComputedProperty;

因此,每当你写

foo: function() {
  return this.get('bar')
}.property('bar')

您实际上是在创建一个匿名函数,然后立即调用其property方法,返回Ember.ComputedProperty的实例。这是分配给foo属性的内容。