.property() 的作用是什么?在函数(){}.property()中

2024-03-23

Todos.TodoController = Ember.ObjectController.extend({
  isCompleted: function(key, value){
    var model = this.get('model');

    if (value === undefined) {
      // property being used as a getter
      return model.get('isCompleted');
    } else {
      // property being used as a setter
      model.set('isCompleted', value);
      model.save();
      return value;
    }
  }.property('model.isCompleted')
});

我正在研究 Ember.js 的 ToDo 指南,但我似乎无法理解这个控制器是如何工作的。 .property() 是什么意思?当我删除“返回值”时,为什么会这样?线功能保持不变。如果有人能准确解释这里发生的事情那就太好了。

指南链接:http://emberjs.com/guides/getting-started/marking-a-model-as-complete-incomplete/ http://emberjs.com/guides/getting-started/marking-a-model-as-complete-incomplete/


在 javascript 中,获取或设置一个属性时进行某些处理的唯一方法是使用对象.defineProperty https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/defineProperty:

Object.defineProperty(person, "b", {
  get : function() { 
    return person.firstName + ' ' + person.surname; 
  },
  set : function(newValue) {
    var names = newValue.split(' '); 
    person.firsname = names[0];
    person.surname = names[1]; 
  },
  enumerable : true,
  configurable : true
});

但这有一些缺点:

  • 不是跨浏览器
  • 没有约束力,换句话说,如果firstname or surname变化,从属财产fullname没有改变。
  • Calling person.name when person未定义,抛出错误
  • 不可能触发观察者,没有额外的代码并且了解依赖关系层次结构:firstname取决于fullname,并且它可以依赖于其他属性啊啊啊!

因此Ember有了“财产”的概念,称为计算属性 http://emberjs.com/guides/object-model/computed-properties/.

它可以通过两种方式声明:

foo: Ember.computed(function({
  ...
}).property(dependent keys);

或使用时(默认)Ember.ENV.EXTEND_PROTOTYPES = true:

foo: function() {
  ...
}.property(dependent keys);

The property(dependent keys), 是必需的,因为它告诉 ember 什么是属性,当更改时,将使属性更新。

fullname: function(key, value) {
  // setter
  if (value !== undefined) {
    var names = value.split(' ');
    this.set('firstname', names[0]);
    this.set('surname', names[1]);
  }
  // always return the complete result, so nexts calls to this.get('fullname') will return the cached value  
  return this.get('firstname') + ' ' + this.get('surname');
}.property('firstname', 'surname')

使用此功能,您可以获得以下优势:

  • 当改变时firstname or surname到一个新的值,fullname被改变了。
  • The beforeObserves在更改值之前触发,并且observes值改变后触发。
  • 任何引用某些属性的模板都会更新
  • 多次调用 person.get('firstname') 将返回缓存的值,从而节省处理。您可以使用禁用此功能.property(..).volatile()
  • 访问 null 对象时,避免 null 或未定义的错误,例如:controller.get('person.dog.name')回报undefined,如果人或狗未定义。

我希望它有帮助

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

.property() 的作用是什么?在函数(){}.property()中 的相关文章

随机推荐