ES6中的namedexport和defaultexport

编程有珠玑 2024-08-20 13:38:37
在 JavaScript 的 ES6 模块系统中,一个模块可以有多种类型的导出(export),包括命名导出(named exports)和默认导出(default export)。 命名导出 (Named Exports)命名导出允许你为模块内的某个变量、函数或类指定一个名字,然后将这个名字作为模块的一部分公开出去。这样,其他模块可以通过这个指定的名字来访问这些导出。 如何定义命名导出在模块内部,你可以使用 export 关键字来声明命名导出。例如: // example.jsexport const someVariable = "Hello, world!";export function sayHello() { console.log("Hello!");}export MyClass { // ...}这里,someVariable, sayHello, 和 MyClass 都是命名导出。 如何导入命名导出当你在另一个模块中想要使用这些命名导出时,你需要使用大括号 {} 来明确指出你想要导入的名称。例如: // main.jsimport { someVariable, sayHello, MyClass } from "./example.js";console.log(someVariable); // 输出: "Hello, world!"sayHello(); // 输出: "Hello!"在这个例子中,main.js 导入了 example.js 模块中的三个命名导出:someVariable, sayHello, 和 MyClass。 默认导出 (Default Export)每个模块可以有一个默认导出,它可以是任何值或类型(变量、函数、类等)。默认导出可以被导入而不使用大括号 {}。 如何定义默认导出你可以直接使用 export default 关键字来声明一个默认导出。例如: // example.jsexport default function() { console.log("This is the default export!");}如何导入默认导出当你导入一个默认导出时,可以给它起任何你喜欢的名字。例如: // main.jsimport myFunction from "./example.js";myFunction(); // 输出: "This is the default export!"这里,main.js 导入了 example.js 模块中的默认导出,并将其命名为 myFunction。 总结命名导出:需要使用大括号 {} 导入,并且可以导入多个命名导出。默认导出:不需要使用大括号 {} 导入,并且一个模块只能有一个默认导出。希望这有助于澄清命名导出的概念!如果有更多问题或需要进一步的解释,请随时提问。
0 阅读:0