JavaScript变量范围 - 正确使用

Question

我从johnpapa那里读到了这个style guide for angular。有一个片段：

/*
 * recommend
 * Using function declarations
 * and bindable members up top.
 */
function Avengers(dataservice, logger) {
    var vm = this;
    vm.avengers = [];
    vm.getAvengers = getAvengers;
    vm.title = 'Avengers';

    activate();

    function activate() {
        return getAvengers().then(function() {
            logger.info('Activated Avengers View');
        });
    }

    function getAvengers() {
        return dataservice.getAvengers().then(function(data) {
            vm.avengers = data;
            return vm.avengers;
        });
    }
}

所以我的问题出在函数activate()和getAvengers()中，它们都引用变量（dataservice）和函数（getAvengers()）在其范围之外。这是正确的用途吗？我应该在变量vm中绑定这些2，例如：

vm.getAvengers = getAvengers; 
vm.dataservice = dataservice;
...
function activate() {
    return vm.getAvengers().then(....);
}

function getAvengers() {
    return vm.dataservice.getAvengers().then(.....);
}

Answer 1

特别针对您的情况

如果你想在角度应用程序中使用它会意味着不暴露服务，通过这个对象公开它不会增加价值，并且可能会在未经验证的开发人员修改你的代码的情况下，可能会导致访问共享依赖项。

如果要跨多个实体访问dataservice对象功能，请将其注册为角度服务，并将其注入需要它的不同实体。

一般

您描述的两种方式都是完全正确的用法，但通常情况下，使用的答案是＆＃34;它取决于。＆＃34;

如果你想在外部公开变量（例如，如果你想让其他人通过返回的对象访问该对象，期望其他人动态更改你对象上的服务），为什么你会使用另一个呢？

所以在这个例子中你应该问自己一些问题

1. 我是否希望通过另一个对象公开此对象，或者我是否希望让角度DI将其传递给需要此功能的其他控制器
2. 我是否希望允许外部实体修改此对象
3. 通过我的对象公开此服务是否会使用此对象的感知使用更加混乱？

但是对于这个特殊情况，你不应该通过你的对象（通过你的变量vm公开它，它绑定到返回对象this，在这种情况下）

Answer 2

vm是视图模型（视图的对象表示）的首字母缩写词，它在视图中用于将元素，ui事件绑定到它。 dataservice和logger似乎与视图无关，它们只是控制器中使用的服务。如果你将它们分配给vm，那么你可能会在你的视图和服务之间创建一个紧密耦合，因此对我来说这似乎不是一个好主意。您可以将VM视为视图和控制器之间的接口（粘合剂）。

以下是视图模型，控制器，视图和服务之间交互的图片。