JavaScript中调用Func()与调用其返回的innerFunc()的区别是什么

你遇到的差异本质是高阶函数返回值的调用逻辑问题，具体解释如下：

核心代码梳理 #

const Func = () => {
  return () => {
    console.log('hello');
  };
};

const innerFunc = Func();

innerFunc(); // 1.

Func(); //2.

两处调用的差异原因 #

• 标注1的innerFunc()执行逻辑：
  你先通过const innerFunc = Func()调用了一次Func，拿到了它返回的匿名函数赋值给innerFunc，此时你调用innerFunc()才是真正执行了包含console.log('hello')的函数逻辑，所以控制台会正常输出内容。
• 标注2的Func()执行逻辑：
  这里你只调用了Func本身，只会拿到它返回的匿名函数，但你没有对这个返回的函数做二次调用，打印逻辑永远不会被触发，因此控制台没有输出。如果要让这里也输出内容，可以修改为Func()()，连续加两个括号完成二次调用即可。

Func和innerFunc的本质区别 #

• Func是高阶函数，作用是返回另一个函数，本身不包含打印hello的业务逻辑，只是生成内部函数的载体。
• innerFunc是Func执行后返回的结果，是真正包含打印逻辑的函数，只有调用它才会触发对应的输出。

内容的提问来源于stack exchange，提问作者정재상