导航
导航
文章目录
  1. export
  2. import

JavaScript中普通接口和默认接口的区别

ES6的模块化功能主要有两个关键字: exportimport

export主要用于模块对外暴露接口。
import用于引入其他模块暴露的接口。

export

export有两种用法:

export default foo

export foo

exportexport default均可用于导出常量、函数、文件、模块等
一种是直接导出,一种是导出默认。区别在于export default导出的是一个默认的变量

这两种的区别在于:

  1. export default 在一个模块里只能有一个,但是export可以有多个
  2. 通过export方式导出,在导入时要加{ }export default则不需要
  3. export能直接导出变量表达式,export default不行
    例如:
    export var foo='...' 是合法语句,但是export default var foo='...'是不合法的
  4. 模块中通过export方式导出的可以重新赋值,但是通过export default导出的无法修改
    例如:
    let e1='e1e1e1';
    let e2='e2e2e2';
    export {e1};
    export default e2;
    e1='hahahaha';
    e2='hahahaha';

    //执行结果
    console.log(e1);
    console.log(e2);

    hahahaha
    e2d2e2

import

export (default)导出的模块,在其他模块中可以通过import导入

不同的是:

使用export foo导出的,导入时需要加个大括号

import {foo} from './a'

通过as重命名

import {foo as e1} from './a'

使用export default foo导出的,导入时不用加入大括号

import foo from './a'

打赏
扫一扫,提供动力能源
  • 微信扫一扫
  • 支付宝扫一扫