.property(...) 在 Emberjs 中做了什么？答案

【问题标题】：What does .property(...) does in Emberjs?.property(...) 在 Emberjs 中做了什么？
【发布时间】：2014-10-10 23:31:24
【问题描述】：

我一直在浏览 Emberjs 文档。我遇到了一个名为computed property 的话题。我已经阅读了那里的每一个字，但传递给.property() 的参数没有任何意义。

以文档中的第一个示例为例。

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

  fullName: function() {
    return this.get('firstName') + ' ' + this.get('lastName');
   }.property('firstName', 'lastName')
  });

  var ironMan = App.Person.create({
  firstName: "Tony",
  lastName:  "Stark"
});

ironMan.get('fullName'); // "Tony Stark"

根据文档

请注意 fullName 函数调用属性。这将函数声明为计算属性，并且参数告诉 Ember 它依赖于 firstName 和 lastName 属性。

只是为了检查arguments 传递给.property() 的意义，我修改了它们。

fullName: function() {
    return this.get('firstName') + ' ' + this.get('lastName');
   }.property('Captain', 'America')
});

ironMan.get('fullName') 返回Tony Stark。

那么最后一个问题是，传递给.property() 的参数有什么意义？

【问题讨论】：

标签： ember.js

【解决方案1】：

.property() 是Ember.computed() 的较短版本。详细说明你的例子

fullName: function() {
    return this.get('firstName') + ' ' + this.get('lastName');
   }.property('firstName', 'lastName')
});

所以基本上如果你不提供.property()，这将是一个简单的方法，在连接后返回全名。但是，只要您调用该方法，它就会一直执行。但是如果你添加.property() [基本上是一个计算属性]，值会被缓存并避免多次执行。

如果 firstName 或 lastName 发生变化，您可能需要更新缓存中的 fullName 值。这就是为什么我们将 .property() 中的参数作为 .property('firstName', 'lastName') 传递。这基本上是观察者的概念。所以基本上在你编写的第二个代码中，你可能认为它工作正常，但是当 firstName 或 lastName 发生变化时，fullName 不会改变，因为它正在观察名为 Captain，America 的变量而不是firstName，lastName。

【讨论】：

解释得很好，谢谢