当我们需要在 JavaScript 项目中将一些功能拆分成多个模块时，就需要在不同的 JS 文件中创建并调用函数。这篇文章将详细介绍如何在一个 JS 文件中调用另一个 JS 文件中的函数，并提供示例代码以便更好地理解。
导出和导入函数
要在另一个 JS 文件中调用当前文件中定义的函数，我们需要使用 export 关键字将该函数导出，然后在另一个文件中使用 import 关键字将其导入。下面是一个简单的示例：
-- ---------- ------ -------- ----------- - ------------------- ----------- - -- ------- ------ - ----- - ---- --------------- --------------
在上面的示例中，我们首先在 module1.js 文件中定义了 greet 函数，并使用 export 将其导出。接着，在 main.js 文件中使用 import 导入 greet 函数，并调用它来打印 "Hello, John!"。
需要注意的是，导出和导入都只能在顶层作用域中使用，不能嵌套在函数或块级作用域中。
导出和导入默认函数
除了可以导出和导入具名函数之外，还可以导出和导入默认函数。默认函数是一个没有名称的函数，它的定义和使用方式与常规函数相同。示例代码如下：
-- ---------- ------ ------- -------------- - ------------------- ----------- - -- ------- ------ ----- ---- --------------- --------------
在上面的示例中，我们定义了一个默认函数，并将其导出。在 main.js 文件中，我们使用 import 导入默认函数，并调用它来打印 "Hello, Mary!"。需要注意的是，在导入默认函数时，我们不需要使用大括号或指定名称。
模块化开发的优点
使用模块化开发可以使代码更易于维护和重用，因为将代码拆分成多个模块可以提高代码的可读性和组织性。此外，模块化开发还有以下优点：
- 可以防止命名冲突：每个模块都有自己的作用域，不同模块中的变量和函数不会互相干扰。
- 可以实现懒加载：只有在需要时才会加载模块，这可以提高应用程序的性能。
- 可以提高代码的安全性：只有被导出的函数和变量才可以在其他模块中访问，隐藏了实现细节。
结论
在 JavaScript 项目中，使用模块化开发可以使代码更易于维护和重用。要在另一个 JS 文件中调用当前文件中的函数，我们需要使用 export 将其导出，并在另一个文件中使用 import 导入。如果要导出默认函数，则可以使用 export default 关键字，而不是具名导出。
希望本文对你有所帮助！
来源：JavaScript中文网 ，转载请联系管理员！ 本文地址：https://www.javascriptcn.com/post/12921