ES6模块

首先,必须明确,一个JS文件就是一个模块。


ES6模块


export命令
  • 用于规定模块的对外接口
  • 导出内容供其他模块使用,一个模块中,export可以调用多次
    必须与模块内部的变量建立一对一的关系,不能直接导出一个值

export写法

  1. export let a = 1;
  2. let a = 1; export {a};
  3. let a = 1; export {a as b};//更改变量a的名字
  • export default 默认导出
    用于指定模块的默认输出。
    一个模块只能有一个默认输出,因此export default命令只能使用一次,所以import和export后面不用加{}花括号

export default写法:

  1. 导出一个匿名函数
    export default function(){}
  2. 导出一个字符串
    export default 'hello';
  3. 导出一个变量
    let m = 1; export default m;
  4. 导出一条语句
    export default let m = 1;

import命令
  • 用于导入其他模块提供的功能
  • 其他JS文件通过import命令加载这个模板

import写法:

  1. 解构导入
    import {a, b, test} from './module';
  2. 重命名变量
    import {a as b} from './module';
  3. 重复导入
    import {a} from './module';
    import {b} from './module';
    如果多次重复执行同一句import语句,那么只会执行一次模块代码。
  4. 模块的整体加载 包括默认导出的数据,export default属性名为’default’
    import * as obj from './module';
  5. 默认模块的导入
    import test from './module';

export和import的复合写法

如果在一个模块中,先导入和后导出都是同一个模块,import语句和export语句可以写在一起
export { foo, bar } from 'my_module';
等同于
import {foo, bar} from 'my_module';
export {foo, bar};


评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

King's Blog

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值