Question

//场景1

<script>
myFunction(); // This won't work.
</script>

<script>
function myFunction() {
    alert("ok");
}
</script>

//场景2

<script>
myFunction(); // This will work.
function myFunction() {
    alert("ok");
}
</script>

为什么呢？谢谢你的帮助！

Answer 1

在JavaScript中，脚本按照它们在页面上显示的顺序加载并阻塞。因为您将它们放在单独的脚本标记中，所以它们是单独加载的。第一个被加载，并且在没有定义的情况下执行该方法。在第二个示例中，方法定义和调用同时加载，这意味着该方法在调用时确实存在。

Answer 2

页面找到的每个脚本标记，它都会执行它。

所以第一个脚本，它运行myFunction（），但它不存在，ERROR。

第二个，myFunction就在那里，好吧。

但请注意以下也是错误：

<script>
    myFunction(); // error
    var myFunction = function() {
        alert("ok");
    }
</script>

当您使用myFunction定义var时，它现在是一个局部变量（此处为全局范围，因此为全局变量），名为myFunction，并且仅在运行期间分配给函数 - 时间。因此，在运行时，您调用myFunction()但尚未分配值，事件不知道myFunction是否为函数。

当你按照以下方式执行时

<script>
    myFunction(); // OK
    function myFunction() {
        alert("ok");
    }
</script>

在预处理过程中会创建一个名为myFunction的函数，它会执行一些初始工作。之后是运行时，它处理myFunction()。所以现在，当它被调用时，有一个带有它名称的函数，没有问题。

Answer 3

在考虑第二个脚本标记之前，会解析并执行整个第一个脚本标记。作为解析脚本的一部分，函数声明会提前被识别，这就是为什么第二个工作，而第一个不工作。

JavaScript：权威指南

出现在和标签之间的JavaScript语句按照出现的顺序执行;当文件中出现多个脚本时，脚本将按照它们出现的顺序执行。如果脚本调用document.write（），则传递给该方法的任何文本都会在结束标记之后立即插入到文档中，并在脚本完成运行时由HTML解析器进行解析。相同的规则适用于具有src属性的单独文件中包含的脚本。

Answer 4

Javascript是客户端的scipting语言。当网页加载浏览器检查页面中可用的所有syntex和功能时。

如果您要在一个<script>代码中定义一项功能，并使用其他<script>代码进行调用，则浏览器只会在第一个<script>代码中进行检查。
如果你想从任何脚本标签调用一个函数，那么把函数放在js文件中并在html页面中使用它。

Answer 5

rajesh kakawat的答案似乎与我观察到的一致，但我没有看到这个问题直接在Flanagan的书中解决，“ JavaScript：The Definitive Guide ”或其他地方。

js被读取并“编译”在一起（在页面的html中使用上面的脚本标记）并通过脚本标记执行脚本标记 - 一次一个脚本标记 - 使用所有定义等连续向下遍历页面上面的脚本标签（但不是来自页面html中的脚本标签）。

这似乎正在发生：

读取当前脚本标签'w js chunk（整个脚本标签）
将当前脚本标记
在当前脚本标记
按当前脚本标记（document.write）处理任何生成的html输出
解析html向下移动到下面的下一个脚本标记，然后返回步骤1，如果下面有另一个脚本标记。

这意味着如果在下面的脚本标记中定义了一个函数（尚未处理）并在当前脚本标记中调用，则会出现“'function x'undefined”错误，因为js解释器不会知道它了。但是，在给定的脚本标记内，可以在列表中的调用下面定义一个函数，并且工作方式与上面在列表中定义的一样。

在javascript中，只有在相同脚本标记中定义之前的函数调用才有效

5 个答案: