JavaScript 中的导出默认值是什么?
export 语句用于创建 JavaScript 模块以从模块中导出对象、函数、变量,以便其他程序可以在 import 语句的帮助下使用它们。
有两种类型的出口。一种是命名导出,另一种是默认导出。命名导出:命名导出对于导出多个值很有用。在导入过程中,必须使用对应对象的相同名称。
// Exporting individual features
export var name1 = …, name2 = …, …, nameN; // also let, const
// Export list
export { name1, name2, …, nameN };
//Exporting everything at once
export { object, number, x, y, boolean, string }
// Renaming exports
export { variable1 as name1, variable2 as name2, …, nameN };
// export features declared earlier
export { myFunction, myVariable };
例子:
//file math.js
function square(x) {
return x * x;
}
function cube(x) {
return x * x;
}
export { square, cube };
//while importing square function in test.js
import { square, cube } from './math;
console.log(square(8)) //64
console.log(cube(8)) //512
输出:
64
512
默认导出:默认导出对于仅导出单个对象、函数、变量很有用。在导入过程中,我们可以使用任何名称进行导入。
// file module.js
var x=4;
export default x;
// test.js
// while importing x in test.js
import y from './module';
// note that y is used import x instead of
// import x, because x was default export
console.log(y);
// output will be 4
输出
4
具有函数的默认导出的另一个示例
// file math.js
export default function square(x) {
return x * x;
}
//while importing square function in test.js
import square from './math;
console.log(square(8)) //64
输出:
64
同时使用命名和默认导出:可以在同一个文件中使用命名和默认导出。这意味着两者都将导入同一个文件中。
例子:
//module.js
var x=2;
const y=4;
function fun() {
return "This a default export."
}
function square(x) {
return x * x;
}
export { fun as default, x, y, square };
在导入这个 module.js 时,我们可以使用任何名称来获得乐趣,因为它是默认导出,而花括号用于其他命名导出。
//test.js file
import anyname, { x, y, square} from './module.js';
console.log(anyname()); //This is a default export.
console.log(x); //2
输出
This is a default export.
2