如何在JavaScript中从另一个脚本调用脚本

当需要在一个脚本中使用另一个脚本的功能时，可以使用JavaScript中的模块（module）。模块是一种将JavaScript代码封装在一个独立的单元中，使其可以被其他脚本调用的方式。在本文中，我们将介绍如何在JavaScript中从另一个脚本调用模块。

创建模块

在JavaScript中，可以使用 export 声明将一个函数或变量作为模块的公共接口，以便其他脚本可以调用它。例如下面的代码创建了一个名为 myModule 的模块，其中有一个名为 myFunction 的函数被导出：

// myModule.js
function myFunction() {
  console.log("Hello from myFunction!");
}

export { myFunction };

导入模块

在另一个脚本中，可以使用 import 声明从外部文件中导入模块。例如，下面的代码导入了上一个例子中定义的 myModule 模块，并调用了其中的函数：

// index.js
import { myFunction } from './myModule.js';
myFunction(); // 输出 "Hello from myFunction!"

在 import 声明中，{ myFunction } 表示从模块中导入名为 myFunction 的变量。'./myModule.js' 表示外部文件的相对路径。

导出多个函数或变量

如果要从一个模块中导出多个变量或函数，可以使用逗号分隔它们。例如下面的代码声明了一个名为 myVariable 的变量和一个名为 myFunction 的函数，并将它们导出：

// myModule.js
let myVariable = 42;

function myFunction() {
  console.log("Hello from myFunction!");
}

export { myVariable, myFunction };

在另一个脚本中，可以使用逗号分隔的变量名导入多个变量或函数。例如，下面的代码导入了上一个例子中定义的 myModule 模块，并使用其中的两个导出变量：

// index.js
import { myFunction, myVariable } from './myModule.js';
console.log(myVariable); // 输出 42
myFunction(); // 输出 "Hello from myFunction!"

导出一个默认函数或变量

如果只需要将模块中的一个变量或函数作为默认导出方式，可以使用 default 关键字。例如下面的代码声明了一个名为 myFunction 的函数，并将其作为默认导出：

// myModule.js
export default function myFunction() {
  console.log("Hello from myFunction!");
}

在另一个脚本中，可以使用 import 关键字导入默认导出方式，并可以将其命名为任何想要的变量名。例如下面的代码导入了上一个例子中定义的模块，并将默认导出命名为 myDefaultFunction：

// index.js
import myDefaultFunction from './myModule.js';
myDefaultFunction(); // 输出 "Hello from myFunction!"

结论

在JavaScript中，使用模块可以使代码更加模块化和可维护。我们可以使用 export 声明从模块中导出函数和变量，并使用 import 声明从另一个脚本导入它们。同时，在导出时也可以使用 default 关键字产生默认导出。