JS模块中的export和export default

在JS Module中,export和export default都可以用来导出某个模块中的一些内容,以便于其他模块可以通过import获取。本文将简单介绍一下export和export default的用法。

命名导出

export也叫named export(命名导出),它允许一个文件导出多个特性。

// 导出单个特性

export const name1, name2, …, nameN; 

export const name1 = …, name2 = …, …, nameN; 

export function FunctionName(){...}

export class ClassName {...}

// 导出列表

export { name1, name2, …, nameN };

// 重命名导出

export { variable1 as name1, variable2 as name2, …, nameN };

// 解构导出并重命名(将myObject中的name2重命名为bar后,进行导出)

export const { name1, name2: bar } = myObject;

⚠️需要注意的是,使用命名导出的时候,导入的时候需要使用相同的名字。

// 例如:

// 导出列表

import { name1, name2, ..., nameN }

// 重命名导出

import { name1, name2, ..., nameN }

// 解构导出并重命名

import  { name1, bar }

默认导出

一个js模块只能有一个默认导出,因此在导入的时候可以随意命名。

// 导出时:

export default { name1, name2, …, nameN };

// 导入时:

import * from './myModule'

import all from './myModule'

// 使用时:

console.log(name1)

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容