es6学习笔记整理(十七)模块化

导出用export,导入使用import
导入导出1:

最基本的使用

//导入
export let str = 'asdf';
export function test(){
    console.log('函数');
}
export class Test2{
    test3(){
        console.log('类');
    }
}
//导出所有模块,这样写比较麻烦
import {str,test,Test2} from 'model2';
console.log(str,test,Test2);

也可以只导出其中的某一个

import {str} from 'model2';
console.log(str);
导入导出2:

在模块比较多的情况下,一个一个写就不现实了,这是就可以用 * as 别名 的格式。如下:
导出还是和上面一样,导入不同。

import * as model from 'model2';
console.log(model.str);
console.log(model.test);
console.log(model.Test2);
导入导出3(推荐):

导出:

let str = 'asdf';
function test(){
    console.log('函数');
}
class Test2{
    test3(){
        console.log('类');
    }
}

export default {
    str,
    test,
    Test2
}

导入:

import model from 'model2';
console.log(model.str);
console.log(model.test);
console.log(model.Test2);

推荐这种的原因:

  • 安全。不导出的模块不暴露
  • 用default导出的时候,不用管名称的对应,简洁不少
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值