有关从其他文件调用函数的问题-Javascript

Question

我正在寻找一些帮助，以了解我正在从事的项目中的某些内容。 我已经写了一些可以正常运行的代码，尽管我不确定为什么。

在Node.js服务器中，/ public / js中有两个脚本。 一个（ file1.js ）具有函数func() 。 在同一目录中的file2.js成功调用func() 。 没有module.export或require在任何地方，但两个文件一起工作。 但是，它们都在index.ejs文件中引用。 这是他们能够交流的地方吗？

//file1.js
function func() {
    console.log("foo")
}

//file2.js

func()

//index.ejs
...
<script src="public/js/file1.js"></script>
<script src="public/js/file2.js"></script>
...

我花了一整天的时间阅读，找不到关于此主题的任何内容。

Answer 1

您的问题是关于JavaScript在浏览器中的工作方式。

Node.js在这里不相关。 它所做的只是运行一个HTTP服务器程序，该程序将静态文件提供给浏览器。

当加载脚本到使用脚本元件的浏览器（和不使用type="module" ）中的脚本文件的最外范围，任何变量（例如未let块或内var内的函数）变成全局变量，并且可以通过这种方式访问​​加载到同一HTML文档中的任何其他脚本。

全局变量是一团糟，并且是不同代码段意外相互干扰的一种好方法，因此现代JavaScript通常避免使用它们。 最初在浏览器中实现JS时，这种JavaScript编程风格并不常见：因此，存在上述行为。

这就是为什么人们开始使用诸如显示模块模式之类的技术的原因，以及为什么在将标准JavaScript模块添加到规范之前设计AMD和Node模块的原因。

Answer 2

您必须了解全局空间在Javascript中的行为。

此代码：

<script src="public/js/file1.js"></script>
<script src="public/js/file2.js"></script>

与此相同：

<script>
    //file1.js
    function func() {
        console.log("foo");
    }

    func();
</script>

因为一旦加载了file1.js ，在其中定义的所有内容都将在包含该文件的页面中的任何位置变为可用。

由于file2.js使用file1.js内容，因此它将起作用，因为func可以在file1.js包含以下的任何地方使用。