javascript - 附加到范围的 AngularJS 方法与 Controller 范围内的方法

Question

我开始重构我们已经进行了几个月的项目。一路上学到了很多关于 Angular 的知识，其中很多将在重构中实现。

在此过程中，我注意到许多方法附加到 Controller 的 $scope 上。其中一些实际上并未被 view 中的任何内容调用或被观看，或者就此而言，除了 fire and forget 之外做任何其他事情。

这让我开始思考。如果任何 View 不需要某个方法，或者观察其结果，不将这些方法附加到 $scope 是否会提高性能？

例如，假设在 Controller 中，我正在异步保存一些数据 - 即发即忘之类的东西。

这会不会:

saveState();    
function saveState(){
       // do my saving here. don't need to return anything
}

给我任何性能提升:

$scope.saveState();    
$scope.saveState = function(){
     // do my saving here. don't need to return anything
}

Answer 1

您刚刚发现了一些非常真实的东西。我实际上会说这样做是不好的，因为你正在污染示波器。 $scope 应该只包含 View 直接需要使用的属性。您可能不会注意到较小应用程序的性能提升，但当您进入 50 多个 Controller 范围且范围内有数千个数据点时，一点点帮助都会有所帮助。我在 Coderwall (https://coderwall.com/p/nsanaa?i=1&p=1&q=author%3Abreck421&t%5B%5D=breck421) 上写了一些关于使用火焰图进行 js 分析的文章。它可以帮助您用一些数字来得出结论。

我将您的想法更进一步，为我的 Controller 创建了一个初始化加载模型。

MyApp.controller('MyController', ['$scope', function ($scope) {
    var self = this;

    this.init = function () {
        this.setScope();
        this.load();
    };

    this.load = function () {
        this.setScopeEvents();
    };

    this.setScope = function () {
        $scope.isLovingStackOverflow = true;
    };

    this.setScopeEvents = function () {
        $scope.answerQuestion = function() { /* answer a question */}
    };

    this.init();
}]);

这样做的好处是您可以从单元测试中调用任何 this.* 函数。

我要表扬您的思维过程改变。在不久的将来，你还会有更多 Angular :)

谢谢，

乔丹