AngularJS控制器中$scope与函数参数$scope的区别及相关疑问

Hey John, 很高兴帮你理清这个AngularJS入门的关键问题——$scope确实是新手容易混淆的点，咱们一步步拆解：

1. 数组中的'$scope'和函数参数$scope的区别 #

• 数组里的'$scope'是依赖注入的“标识字符串”：AngularJS的依赖注入系统默认靠参数名识别服务，但如果代码被压缩（比如把参数名改成a/b），Angular就找不到对应的服务了。这个带引号的字符串是明确告诉Angular：“我要注入的是名为$scope的官方服务”，它是固定的服务标识，必须用字符串形式写。
• 函数里的$scope是你自定义的变量名：它只是用来接收Angular注入进来的$scope实例的“容器”，你甚至可以改成任意合法变量名，比如myScope，只要数组里的标识字符串保持'$scope'就不会影响功能。

2. 二者的关联 #

数组里的'$scope'相当于给Angular发了一个指令：“帮我把$scope服务的实例传递给后面的控制器函数”；而函数参数里的$scope就是接收这个实例的变量。简单说就是：标识字符串定好要拿什么，函数参数是你用来操作这个东西的“抓手”。

举个改名的例子更直观：

var mainApp = angular.module("mainApp", []);
// 参数改成myScope，数组标识还是'$scope'，功能完全正常
mainApp.controller(['$scope', function(myScope) {
  myScope.name = "John"; // 依然能把数据绑定到视图上
}]);

3. 是否必须设置$scope参数？ #

分两种场景：

• 如果控制器需要和视图交互：比如绑定数据、定义视图可用的方法，那必须注入$scope——这是AngularJS里控制器衔接模型（数据）和视图的核心载体，大部分业务场景都离不开它。
• 如果控制器完全不需要和视图交互：比如只做纯逻辑处理（比如内部计算、数据转换，不需要把结果暴露给视图），那可以不注入$scope。比如：

var mainApp = angular.module("mainApp", []);
// 这个控制器只做内部计算，不用和视图交互，所以不需要$scope
mainApp.controller([function() {
  var calculateSum = function(a, b) {
    return a + b;
  };
  console.log(calculateSum(2, 3)); // 控制台输出5，完全不涉及视图
}]);

不过这种场景非常少见，因为AngularJS控制器的核心职责就是连接视图和模型，大部分情况下你都会用到$scope。

希望这些解释和例子能帮你彻底搞懂$scope的用法！

内容的提问来源于stack exchange，提问作者John