Javascript 在AngularJS控制器中创建包含功能的对象还是创建松散的功能更好？

假设我们的网站上有三个按钮：

<button>Like</button>
<button>Dislike</button>
<button>Flag</button>

由于将

$scope

与太多的观察者混在一起对性能有害，所以这样做不是更好吗：

$scope.actions = {
  like: function() {
    return likes + 1;
  },
  dislike: function() {
    return dislikes + 1;
  },
  flag: function() {
    return flags + 1;
  }
}

然后像这样使用它：

<button ng-click="actions.like()">Like</button>
<button ng-click="actions.dislike()">Dislike</button>
<button ng-click="actions.flag()">Flag</button>

Like
不喜欢
旗帜

这将使观察者的数量从3个减少到1个，同时还提供了创建分组功能的好处。这也导致了更好的可读性

在我看来，这比在控制器中使用松散的函数更有意义，特别是因为并非所有控制器都可以轻量级化

让我怀疑这种方法的原因是，我从未遇到过任何使用这种方法的例子。这有什么原因吗

就常用的设计模式、最佳实践和性能而言，哪种方法更适合使用

编辑：有人建议我应该使用

控制器作为

语法，我知道这一点，但这并不能直接回答我的问题。我想知道我上面提到的两种方法中哪一种是更好的选择，不使用

控制器作为
语法。
我同意-观察者的数量不会改变

另外，我建议您使用“controller as”语法。在您的页面中为几个$scope工作更方便

例如，在标记中：

<div ng-controller='PageController as page'>
    <button ng-click="page.like()">Like</button>
    <button ng-click="page.dislike()">Dislike</button>
    <button ng-click="page.flag()">Flag</button>
</div>

我刚刚尝试了两种方法，没有发现性能上的任何差异。这有两个主要的实际原因：

很难测试角度应用程序的性能，请参阅

只在更大规模的应用程序上测试性能是有意义的，而不是在这样小的示例上

不过，我知道你的问题是关于概念证明的。
因此，从理论上讲，第二种方法是更好的方法，因为它比另一种方法污染
$scope
，这是推荐的方法

将来，我会尝试
controllerAs
语法。或者，这也很有趣。
希望这能有所帮助。
观察者的数量不会改变。首先我不确定，但我认为ng click没有添加观察者，但是如果它添加了，那么这两个示例完全相同。第二个更好的方法是退出$scope问题（名称冲突）。ng单击不会添加它，但绑定函数会添加它。如果您使用控制器作为语法（这是准备迁移到angular 2的推荐方法）。this.like在作用域中注册为$scope.vm.like，看起来像您的方法。@Chrillewoodz我支持上面所说的：ng单击不会创建额外的观察者。所以你的问题没有意义。controllerAs语法建议在一些权威的地方使用，例如@Ursus I从未说过ng click会添加一个观察者，我说过使用$scope.myFunction绑定一个函数。因此，只使用一个$scope创建一个对象将减少观察者的数量，如果您仔细考虑，这是有意义的。然而，我的思维过程可能是完全错误的，因此我提出了这个问题。所以说“你应该使用”控制器作为“语法并不能完全回答我的问题，因为我想知道Angular如何处理我的声明，如果不使用controller as，我应该使用哪种方法。我过去曾尝试使用controller as语法，但不喜欢它，它在嵌套ng重复时产生了问题。而且我很确定它仍然处于实验状态，不是吗？这也不能直接回答我的问题，所以我不能接受。@Chrillewoodz
controller as
已经很久没有实验了。它甚至超越了传统语法。也就是说，使用angular2，您的视图中将不再有控制器，因此现在是切换到新语法的时候了。@Yoshi但如果没有控制器，为什么会有“控制器作为”语法？控制器是如何更换的？@Chrillewoodz在angular2中，一切都是组件。将数据绑定到此
。不再使用
$scope
。这就是为什么现在采用
控制器作为
很有用，因为它也绑定到
这个
。参考：@Chrillewoodz我在我的页面控制器和指令的一个大项目中使用了“controller as”语法，我认为这是一个很好的实践。这种语法在v.1.1.5中是实验性的，但现在我们有了1.4.5！而且我没有因为使用它而遇到麻烦。回答您的问题：使用$digest cycle查看标记中每个控制器的方法，这并不取决于您的变量/方法声明的样式。有一条规则：不要在一个作用域中创建多个观察者，并且你没有性能问题。有趣的东西是有角度的。扩展的东西，我必须试试那个。谢谢：）@Chrillewoodz没问题。还有一个有趣的问题：）
<button ng-click="actions.like()">Like</button>
<button ng-click="actions.dislike()">Dislike</button>
<button ng-click="actions.flag()">Flag</button>

<div ng-controller='PageController as page'>
    <button ng-click="page.like()">Like</button>
    <button ng-click="page.dislike()">Dislike</button>
    <button ng-click="page.flag()">Flag</button>
</div>

myApp.controller('PageController', function() {
    var page = this;

    page.like = function() {
       return page.likes + 1;
    }

    page.dislike = function() {
       return page.dislikes + 1;
    }

    page.flag = function() {
       return page.flags + 1;
    }
});