不是自我调用匿名函数

Question

Bootstrap css使用以下内容：

!function( $ ) {
}( window.jQuery )

这与我最初学习的自我调用的匿名函数调用不同：

(function($) {
})(jQuery);

问：你觉得这只是偏好吗？我的意思是不是符号而不是用括号括起来。

Answer 1

  

“问：你认为这只是偏好吗？”

是的，但是使用一元!运算符，当您在​​IIFE之前忘记分号时可以避免一些错误，这可能导致()被解释为函数调用。

alert('foo')  // alerts 'foo'

(function() {  // TypeError: undefined is not a function
    alert('bar');
})()

此处外部()被解释为函数调用。它试图调用从alert()函数返回的任何内容，当然它返回undefined，这不是函数。

---

alert('foo')  // alerts 'foo'

!function() {
    alert('bar');  // alerts 'bar'
}()

没有麻烦，因为!是一元运算符，只计算右边的操作数。

Answer 2

以function关键字开头的语句被视为函数声明，后面必须跟一个有效标识符的名称。

匿名函数表达式以单词function开头，但由于没有名称，因此不能在可能与函数声明混淆的地方使用它。在大多数情况下，分组运算符用于表示函数表达式：

(function() {
  /...
}());

或

(function() {
  /...
})();

你也可以这样做：

var foo = function() {
}();

在上述所有情况中，function关键字不在语句的开头，因此它被视为函数epxression的开头。不需要名称，可以立即调用该函数。

与!function...相同。解析器看到!并说“后面是表达式”。当它到达function时，它知道它是函数表达式的开始。

使用!function…代替(function…)可以保存单个字符，并且可能会产生一些混淆，因为它是编写函数表达式的一种不太常见的方式。