Question

我之前读过：

What is the benefit of wrapping angular controller/service/factory declarations in an anonymous function

Are there any benefits to wrapping angular javascript file with the "(function() { ....[js code here]...... })();"

既不解决我的问题。在IIFE块中包装JavaScript时，我已经看到了这一点：

(function (window, angular, undefined) {
'use strict';

angular.doSomething();

// more code here
})(window, window.angular);

还有这个：

(function () {
'use strict';

angular.doSomething();

// more code here
})();

显然，角度是在全球空间中定义的，但第一种方法在第二种方法中的优点或缺点是什么？无论如何，JavaScript将通过引用传递角度。是否存在任何性能，范围安全性增益，还是仅仅对代码缩小有益？

Answer 1

从您的列表中，只有代码缩小目的是相关的，其他两个则不相关。

但是还有一个潜在的好处。考虑加载角度的文档，然后是脚本，然后是另一个脚本。最终脚本可能会在以后更改全局命名空间中的angular（加载更新的版本，甚至是恶意的版本），从而导致代码行为不正常。

以下是一个例子：

////////////////////
// 1. Angular is loaded directly.

////////////////////
// 2. Your code:
(function() {
  'use strict';
  
  window.setInterval(function() {
    console.log(angular.version.full);
    document.write(angular.version.full + "<br>");
  }, 1000);

  // more code here
})();

////////////////////
// 3. Another snippet/library:
window.setTimeout(function() {
  window.angular = { version: { full: "muhahaha!" } };
}, 2500);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

“muhahahas”不会与其他变体一起出现：

////////////////////
// 1. Angular is loaded directly.

////////////////////
// 2. Your code:
(function(window, angular) {
  'use strict';
  
  window.setInterval(function() {
    console.log(angular.version.full);
    document.write(angular.version.full + "<br>");
  }, 1000);

  // more code here
})(window, window.angular);

////////////////////
// 3. Another snippet/library:
window.setTimeout(function() {
  window.angular = { version: { full: "muhahaha!" } };
}, 2500);

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.7/angular.min.js"></script>

将角度传递到IIFE块

1 个答案: