Angularjs 在匿名函数中包装控制器
我是否:Angularjs 在匿名函数中包装控制器,angularjs,Angularjs,我是否: (function () { 'use strict'; // Create the module and define its dependencies. var app = angular.module('app', [ // Angular modules 'ngAnimate', // animations 'ngRoute' // routing // Custom modules // 3r
(function () {
'use strict';
// Create the module and define its dependencies.
var app = angular.module('app', [
// Angular modules
'ngAnimate', // animations
'ngRoute' // routing
// Custom modules
// 3rd Party Modules
]);
// Execute bootstrapping code and any dependencies.
app.run(['$log',
function ($log) {
$log.log('we are loaded');
}]);
})();
或
两者似乎都起作用了——有什么区别
我希望您能解释一下什么是匿名函数,何时使用匿名函数,以及为什么我看到AngularJs的控制器都是用两种方式编写的
谢谢 两者都会起作用。你会发现很多JavaScript代码包装在匿名函数中的原因是为了将它与页面上的其他代码隔离开来 以下代码将在全局范围内声明名为
name
的变量:
var name = "Hello World";
通过使用该代码,页面上试图使用名为name
的变量的任何其他脚本都可能会获得一个意外值“Hello World”
,因为您的脚本将其声明为“Hello World”
通过将该代码包装在匿名函数中,可以防止代码与名为name
的其他变量发生冲突:
(function() {
var name = "Hello World";
})();
在上面的示例中,name
现在仅在匿名函数的作用域内可用。它不是全局的,因此不能与页面上的其他代码冲突
在您提供的第二个代码段中,app
现在将是一个全局变量,可能会被其他声明名为app
的全局变量的人覆盖。通过将Angular模块包装在匿名函数中,可以防止代码与其他代码冲突
此外,其他可能使用您的代码的人不必担心它会改变他们的全局范围。JavaScript的局部变量只存在于函数范围内 因此,如果使用IIFE(立即调用的函数表达式),如下所示:
(function () {
var app = angular.module('app', []);
})();
您不能在功能之外访问您的模块:
(function () {
var app = angular.module('app', []);
})();
// will get app is undefined error
app.run(['$log', function ($log) {
$log.log('we are loaded');
}]);
声明局部变量而不是全局变量是一个好主意。这将使您的应用程序变量无法在全局环境中访问
如果声明一个全局变量,
您的变量可以在任何地方使用,并且可能与其他javascript程序冲突。您认为这真的是必要的吗?我发现自己这样做只是因为JSHint指南是这样设置的。这不是必需的,没有它,您的代码可以正常工作,但这是一个很好的实践。正如我在回答中所概述的,如果不将代码包装在某种隔离结构中,可能会导致它干扰页面上的其他代码。随着项目的发展,您将开始遇到问题。根据您使用JavaScript的经验,您可能已经体验过,也可能还没有体验过。不过,我可以相当肯定地向您保证,您最终会遇到缺乏代码隔离的问题。:)尽管@JesseDunlap确实找到了答案,但我要补充的是,谷歌赞助的代码学校“与angularJS一起塑造”课程也推荐了你的第一种方法。我引述:“将Javascript封装在闭包中是一个好习惯”。很好的解释。我担心这些函数的包装会阻止我访问一个文件中的角度变量到另一个文件中,但我发现这不是问题。再次声明答案!我最近在AngularJS中看到了一个示例,其中代码被包装在一个匿名函数中,参数如下所示:
(function () {
var app = angular.module('app', []);
})();
// will get app is undefined error
app.run(['$log', function ($log) {
$log.log('we are loaded');
}]);