没想到的 IIFE

没想到的 IIFE

有时候我们想要立即执行一下所定义的函数，可以怎么做呢？

function foo(num) {
    
    
  return num ?? 1;
}

foo();

写完然后调用对吧，这是可以的，但你有没有觉得这其实有点脱裤子放屁了，完全可以直接调用就是了对吧，也就是 IIFE（Immediately-Invoked Function Expression），立即执行的函数表达式。

(function foo() {
    
    
	return num ?? 1;
})()

有人说， IIFE 很简单呀，还需要你写文章吗？如果我是要写怎么使用 IIFE，当然没必要，我写这个，是因为我发现了一点有趣的东西。

什么呢？我们先来看三段语句：

function foo() {
    
    
	return num ?? 1;
}()

function foo(num) {
    
    
  return num ?? 1;
}(2)

(function foo(num) {
    
    
  return num ?? 1;
}());

你觉得上面这些能执行成功吗？

不是想考哈，考这个太没意思了，主要就是探究一下

是不是不知道了哇，先不要慌，我们从头看：

function foo(num) {
    
    
  return num ?? 1;
}

foo();

从这里是不是可以看出，只要在函数名后面加上圆括号，就能调用（执行）函数了。那么我们可以大胆的猜测，直接在函数后面添加括号是不是也可以执行呢？

我们来看看呢？

function foo(num) {
    
    
  return num ?? 1;
}();	
// SyntaxError： Unexpected token ')'

执行直接会报语法错误，为什么呢？因为：

1. function foo(num) {...} 是一段语句（函数声明语句）
2. 放在语句后的括号与前面的语句完全分开，只是一个分组运算符（用作控制计算优先级的手段），此时的括号里面需要包含一个表达式。

那么，下面这段代码的结果就不言而喻了

function foo(num) {
    
    
  return num ?? 1;
}(2)

既不会报错，也不会执行 foo，因为 (2) 和前面的语句是完全分开的。

那再来看第三段：

(function foo(num) {
    
    
  return num ?? 1;
}());

这就能正常执行了，为什么呢？

因为：

1. 括号里面的内容都会识别为表达式
2. 放在表达式后的括号表明该表达式是要调用的函数

当然，下面这种也是能正常工作的，左侧括号使一个表达式。

(function foo(num) {
    
    
  return num ?? 1;
})();

我想，看到这里，你应该知道为啥在文章开头我要将 “立即执行的函数表达式” 中的函数表达式标红了吧，这里也纠正一个常犯的错误：IIFE 可不是一个函数，而是一个表达式哟！