JavaScript 调用函数

Question

谁能解释一下它是如何工作的？

console.log(func(10));
// 20
var func = function(x) {
    return x * x;
}

console.log(func(10));
// 100
var func = function(x) {
    return x + x;
}

我想知道电脑是怎么读取的？请尽可能简单地解释。

编辑：
我问是因为我在书中发现 "Eloquent Javascript" 是这样的：

console.log("The future says:", future());

function future() {
  return "We STILL have no flying cars.";
}

他说：

This code works, even though the function is defined below the code that uses it. This is because function declarations are not part of the regular top-to-bottom flow of control. They are conceptually moved to the top of their scope and can be used by all the code in that scope. This is sometimes useful because it gives us the freedom to order code in a way that seems meaningful, without worrying about having to define all functions above their first use.

Answer 1

更新：重新编辑，见下方分隔线。

您提供的代码不会起作用。不过，我们可以稍微重新排序以使其正常工作：

var func = function(x) {
    return x * x;
};
console.log(func(10)); // 100

var func = function(x) {
    return x + x;
};
console.log(func(10)); // 20

以上是发生的情况：

在代码的任何一步执行之前，浏览器会扫描代码中的var声明。它找到第一个 var func 并因此在当前上下文中使用该名称创建一个变量。然后它找到第二个 var，但由于名称相同，它对第二个没有任何作用。此时，func 的值为 undefined。（这个提前 var 的位称为“变量提升”。）

现在开始逐步执行代码。
引擎将函数分配给 func 变量。
引擎调用func，传入10。 func returns 10 * 10 (100);引擎将该值传递给 console.log，后者将其写出。
引擎将新函数分配给 func 变量。
引擎调用func，传入10。 func returns 10 + 10 (200);引擎将该值传递给 console.log，后者将其写出。

那么您展示的代码有什么问题？以下是引擎如何运行问题中的代码：

在代码的任何逐步执行之前，浏览器扫描代码以查找var声明并创建变量，如下所示#1 以上。

现在开始逐步执行代码。
引擎尝试调用 func，但 func 中的值当前为 undefined，因此失败并出现错误。

重新编辑： 您从 Eloquent JavaScript 发布的代码非常不同：

console.log("The future says:", future());

function future() {
  return "We STILL have no flying cars.";
}

它使用了 函数声明 ，而您之前的代码使用了 函数表达式 。 This question and its answers 进入细节，但是声明和表达式，即使它们看起来 非常相似 ，但它们的行为却大相径庭。这是上面的顺序：

JavaScript 引擎扫描代码以查找函数声明并按源代码顺序处理它们。所以它看到 function future() { ... } 并创建函数，将它与范围内标识符 future 相关联。这称为“函数声明提升”，有点像上面的 var 提升，因为它发生在任何逐步代码完成之前。

然后开始一步步执行
引擎调用 future 函数，获取其 return 值，然后使用该 return 值调用 console.log。

JavaScript 调用函数

JavaScript call functions

javascript

callstack

function