javascript中的import和export

使用 import 重用 JavaScript 代码

通过import我们选择导入文件或者模块的哪些部分！
例如从math_function.js中我们有一个add和subtract 函数，我们该如何在其他文件或者模块导入add函数呢？

import { add } from './math_functions.js';

• import将查找math_functions.js，导入add函数，并且忽略其他内容。
• ./告诉import在当前文件相同的目录查找math_functions.js
• 如果我们需要再加入subtract只需要使用逗号就可以了！

import { add, subtract } from './math_functions.js';

使用 * 从文件中导入所有内容

• 可以使用 import * as 语法从文件中导入所有内容/函数。例如：

import * as myMathModule from "./math_functions.js";

• 上面的 import 语句将创建一个名为 myMathModule 的对象。
• 该对象将包含来自 math_functions.js 的所有导出，因此你可以像访问任何其他对象属性一样访问这些函数。
• 以下是如何使用导入的加法和减法函数：

myMathModule.add(2,3);
myMathModule.subtract(5,3);

导出默认值

如果一个模块或者文件只导出一个值，我们就可以使用导出默认值。

示例1：

export default function add(x,y) {
  return x + y;
}

示例2

export default function(x,y) {
  return x + y;
}

• 第一个是命名函数，第二个是匿名函数。

• 由于 export default 用于声明模块或文件的导出值，因此每个模块或文件中只能有一个值作为默认导出。

导入默认导出

• 要导入默认导出，您需要使用不同的导入语法。
• 在以下示例中，add 是 math_functions.js 文件的默认导出。
• 以下是如何导入它：

import add from "./math_functions.js";

结论：

• 使用 import 关键字，我们可以选择要导入文件或模块的哪些部分。
• 可以使用 import * as 语法从文件中导入所有内容/函数。