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导出的时候,不用管名称的对应,简洁不少

你可能感兴趣的:(es6学习笔记整理(十七)模块化)