Javascript Angularjs依赖注入丑陋

有一段时间，我使用这种方法在我的angulur应用程序中注入依赖项

angular.controller('ctrlName', ['$scope', '$log', function($scope, $log) {

}]);

如您所见，我们通常传递依赖项两次

• 阵列中的一次
• 函数参数中的第二次

所以，今天我想我们为什么要这么做，所以我用谷歌搜索了一下，并阅读了一些关于StackOverflow的答案，大多数人说他们这样做是为了

uglify

代码

在上面的例子中，我知道我们可以做到这一点

angular.controller('ctrlName', ['$scope', '$log', function(scopeAlias, logAlias) {

}]);

但我不明白这是如何丑化代码的。 所以，我想知道

• 以上述方式注入依赖项如何帮助丑化代码？
• 我为什么要丑化我的角度代码？
• 为什么在生产过程中首选此方法？

---

当你通过一个工具运行你的JavaScript，使你的代码变得丑陋时，它会把你的JavaScript变量变短，变得难以理解。但是，uglification过程不会修改字符串值。这一事实使得依赖注入即使在丑化发生后也能工作

丑化后，您的代码可能是：

angular.controller('ctrlName',['$scope','$log',function(a,b){}]);

如果您的应用程序不是生产级应用程序，并且您不会对其进行丑化，那么可以完全删除字符串，angular的DI将仅基于名称注入依赖项

如果代码从未被丑化，这也会起作用：

angular.controller('ctrlName', function($scope, $log) {

});

---

当你通过一个使你的代码丑陋的工具来运行你的JavaScript时，它会使你的JavaScript变量变短，变得难以理解。但是，uglification过程不会修改字符串值。这一事实使得依赖注入即使在丑化发生后也能工作

丑化后，您的代码可能是：

angular.controller('ctrlName',['$scope','$log',function(a,b){}]);

如果您的应用程序不是生产级应用程序，并且您不会对其进行丑化，那么可以完全删除字符串，angular的DI将仅基于名称注入依赖项

如果代码从未被丑化，这也会起作用：

angular.controller('ctrlName', function($scope, $log) {

});

---

基本上，当您缩小代码变量、函数参数等时，将重命名为更小的值，因此这会中断angular中的依赖注入，因为angular不再能够知道您已将哪些依赖注入模块/控制器/服务函数等

当你像在上面一样指定它两次时，你就是在添加组件。因此，当缩小时，这会创建一种映射，因此组件仍然能够推断您注入了什么

请参阅此链接以获得良好的解释

---

您可能希望缩小代码，以减小其大小，并减少通过网络请求传输以及在浏览器中解析所需的时间。因此，在生产中，这是一件非常好的事情。但是，在开发过程中您不需要这样做，因为这会减慢您的速度（缩小大量代码可能需要时间），并且会妨碍您捕获和查看应用程序错误的能力。

基本上，当您缩小代码变量、函数参数等时，会将其重命名为更小，因此，这打破了angular中的依赖注入，因为angular不再能够知道您已将哪些依赖注入模块/控制器/服务功能等

当你像在上面一样指定它两次时，你就是在添加组件。因此，当缩小时，这会创建一种映射，因此组件仍然能够推断您注入了什么

请参阅此链接以获得良好的解释

您可能希望缩小代码，以减小其大小，并减少通过网络请求传输以及在浏览器中解析所需的时间。因此，在生产中，这是一件非常好的事情。然而，在开发过程中您不需要这样做，因为这会降低您的速度（缩减大量代码可能需要时间），并且会妨碍您捕获和查看应用程序错误的能力

以上述方式注入依赖项如何帮助丑化 密码

认识到丑陋=缩小。缩小代码的一个步骤是用一个变量名替换一个变量名 较小的变量名。为$inject指定服务名称会使控制器的参数名称不相关，因此缩小不会破坏代码

为什么我要丑化我的角度代码

同样，丑=缩小。主要原因是小型化代码占用的网络空间较小

为什么在生产过程中首选这种方法

同样，更小的网络占用空间。当与压缩（如GZip）结合使用时，可以显著节省成本。下面是斯科特·汉斯曼（Scott Hanselman）关于原因的一篇好文章

以上述方式注入依赖项如何帮助丑化 密码

认识到丑陋=缩小。缩小代码的一个步骤是用一个变量名替换一个变量名 较小的变量名。为$inject指定服务名称会使控制器的参数名称不相关，因此缩小不会破坏代码

为什么我要丑化我的角度代码

同样，丑=缩小。主要原因是小型化代码占用的网络空间较小

为什么在生产过程中首选这种方法

---

同样，更小的网络占用空间。当与压缩（如GZip）结合使用时，可以显著节省成本。Scott Hanselman很好地解释了其中的原因。

angularJS中有3种类型的依赖项注释，您使用的是

内联数组表示法（angularJS文档中描述的首选方法）。另外两个是
$inject属性注释
和
隐式注释

一般来说，使用隐式注释被认为是不好的做法，因为它会与任何缩小/模糊工具中断，因为它们如何重命名其参数

您可以参考本文来了解更多关于角度依赖注入的信息

内联数组注释?
someModule.controller('MyController', function($scope, greeter) {
  // ...
});