该功能之前感叹号做了什么?

!function () {}();

JavaScript语法101.这是一个函数声明

function foo() {}

请注意,没有分号:这只是一个函数声明 。 您需要一个调用foo()来实际运行该函数。

现在,当我们添加看起来无害的感叹号时: !function foo() {}将它变成一个表达式 。 它现在是一个函数表达式

! 当然,单独不调用函数,但我们现在可以在末尾放置() !function foo() {}() ,它的优先级高于! 并立即调用该函数。

所以作者正在做的是每个函数表达式保存一个字节; 一个更可读的写作方式是:

(function(){})();

最后! 使表达式返回true。 这是因为默认情况下,所有的IIFE都返回undefined ,这留给我们!undefined这是true 。 不是特别有用。


功能:

function () {}

没有返回(或未定义)。

有时我们想在创建它时调用一个功能。 你可能会尝试这样做:

function () {}()

但它会导致SyntaxError

使用! 运算符在函数导致它被视为一个表达式之前,所以我们可以称它为:

!function () {}()

这也将返回函数返回值的布尔值,在这种情况下为true ,因为!undefinedtrue 。 如果你想让实际的返回值成为调用的结果,那就试试这样做:

(function () {})()

使用有好处! 用于在airbnb JavaScript指南上标记的函数调用

通常在单独的文件(又名模块)上使用这种技术的想法,这些文件稍后会被连接起来。 这里的警告是文件应该由将新文件放在新行的工具连接起来(对于大多数concat工具来说这是常见的行为)。 在这种情况下使用! 将有助于避免以前连接的模块错过后缀分号时的错误,但这样可以灵活地将它们按任意顺序放入,而不用担心。

!function abc(){}()
!function bca(){}();

将工作相同

!function abc(){}()
;(function bca(){})();

但保存两个字符和任意看起来更好。

顺便说一句,任何+-~void操作符在调用函数方面都具有相同的效果,当然如果您使用某个函数从该函数返回,它们的行为会有所不同。

abcval = !function abc(){return true;}() // abcval equals false
bcaval = +function bca(){return true;}() // bcaval equals 1
zyxval = -function zyx(){return true;}() // zyxval equals -1
xyzval = ~function xyz(){return true;}() // your guess?

但如果使用IIFE模式进行一个文件一个模块代码分离并使用concat工具进行优化(这使得一行一个文件作业),而不是构建

!function abc(/*no returns*/) {}()
+function bca() {/*no returns*/}()

将执行安全的代码执行,与第一个代码示例相同。

这一个将抛出错误的原因JavaScript ASI将无法完成其工作。

!function abc(/*no returns*/) {}()
(function bca() {/*no returns*/})()

关于一元运营商的一个注意事项是,他们会做类似的工作,但只有在他们不使用第一个模块的情况下。 所以如果你不能完全控制连接顺序,它们就不那么安全。

这工作:

!function abc(/*no returns*/) {}()
^function bca() {/*no returns*/}()

这不是:

^function abc(/*no returns*/) {}()
!function bca() {/*no returns*/}()
链接地址: http://www.djcxy.com/p/353.html

上一篇: What does the exclamation mark do before the function?

下一篇: What is the purpose of the var keyword and when should I use it (or omit it)?