javascript - Ember 的特性有哪些？或者它们是方法？

Question

这可能是一个非常愚蠢的问题，但我觉得它让我无法理解 Ember 的大部分内容。

在下面的代码中:

App.IndexRoute = Em.Route.extend({
  skipSidebar: true
});    

什么是“skipSidebar:”？ javascript 编程语言是什么？Ember 中又是什么？

另一个例子:

App.AboutRoute = Ember.Route.extend({
  activate: function(){
    this.controllerFor('application').set('renderAboutSubNav', true);
  },
  deactivate: function(){
    this.controllerFor('application').set('renderAboutSubNav', false);
  }
});

什么是“激活:”和“停用:”？

在第一个示例中，我使用“skipSidebar”来渲染部分内容:

{{#unless skipSidebar}}
   {{partial 'sidebar'}}
{{/unless}}

但我不太确定我为什么这样做或者它在做什么。

本质上，我看到这些看起来像路由和 Controller 内部的方法的名称，但我不确定它们来自哪里。如果有人能像我是金毛猎犬一样向我解释这一点，那就太棒了。我什么时候可以使用它们？我什么时候应该使用它们？我该如何使用它们？

Answer 1

从纯 Javascript 语法的 Angular 来看，这段代码:

App.IndexRoute = Em.Route.extend({
  skipSidebar: true
});

相当于这个 Ruby:

App['IndexRoute'] = Em['Route'].extend( { 'skipSidebar' => true } );

也就是说，它将哈希的一个元素(在 Javascript 中所有对象本质上都是)分配给另一个哈希的元素上的方法调用的结果，参数是第三个哈希，这就是字面量form(JSON的基础)。

事实上，您可以用与 Ruby 几乎相同的形式编写 JS:

App['IndexRoute'] = Em['Route'].extend( { skipSidebar: true } );

...因为 JavaScript 中的 Name.Key 语法只是 Name['Key'] 的便捷快捷方式，当键字符串是有效标识符时，该快捷方式起作用。这也有效:

App['IndexRoute'] = Em['Route']['extend']( { skipSidebar: true } );

因为 Javascript 与 Python 类似，方法实际上只是属性(哈希元素)，其值为函数/闭包。

然而，从语义上讲，这在 Ember 中所做的是在 App 对象(用于命名空间)中定义一个名为 IndexRoute 的类，作为Ember 定义的类 Route(在 Em 对象/命名空间中)，并添加一个默认为 true 的属性 skipSidebar code> 对于所有新的 App.IndexRoute 对象。所以从功能上来说，它更像是 Ruby:

class App::IndexRoute < Em::Route
  attr_accessor :skipSidebar
  def initialize
    @skipSidebar = true
  end
end

在第二个示例中:

App.AboutRoute = Ember.Route.extend({
  activate: function(){
    this.controllerFor('application').set('renderAboutSubNav', true);
  },
  deactivate: function(){
    this.controllerFor('application').set('renderAboutSubNav', false);
  }
});

我们再次定义一个子类(这次是 Ember.Route 而不是 Em.Route)，并在子类中添加或重写两个名为 的方法>激活和停用。 ruby :

class App::AboutRoute < Ember::Route
  def activate
    self.controllerFor('application').renderAboutSubNav = true
  end
  def deactivate
    self.controllerFor('application').renderAboutSubNav = false
  end
end