Export和import
Export和import
wade
发布于 2020-04-24 10:43:19
发布于 2020-04-24 10:43:19
Es6的模块功能几乎所有人都在用，而且实现的非常简单，可以说成为了通用的模块方案。主要就到处模块export和导入模块import。
Export
到导出模块可以是函数、类，也可以是var、let、const定义的变量，但是一定不能直接导出一个字符串或者数字，一个js里面可以有多个export，可以一起导出用花括号{}把要导出的内容都包裹起来：
const a = 10;
const b = {
c: 5
};
const d = () => {
console.log(8)
}
function f() {
console.log(9)
}
export {a, b, d, f}也可以分别单个一个一个导出：
export const a = 10;
export const b = {
c: 5
};
export const d = () => {
console.log(8)
}
export function f() {
console.log(9)
}Import
导入只需要注意命名要跟导出的命名一样，然后用花括号{}包起来：
import {a, b, d, f} from "./utils/plugin1";
console.log(a)
console.log(b)
console.log(d)
console.log(f)如果没有名字对应打印出来的就是undefined。
还可以整个模块导入：
import * as lib from "./utils/plugin1";
console.log(lib.a)
console.log(lib.b)
console.log(lib.d)
console.log(lib.f)还有一种默认导出一个的export default：
var obj = 5
export default obj;用export default导出不需要用花括号{}包起来，导入的时候也不需要花括号{}，名字也可以自己起
import lib from "./utils/plugin1";因为export default只能导出一个，所以可以导出一个对象：
var obj = {
a: 10,
b(){
},
c: function () {
},
d:{
e: 15
}
}
export default obj;
或者：
export default {
a: 10,
b(){
},
c: function () {
},
d:{
e: 15
}
}需要注意的是export和import只支持静态导入和导出，你只可以在模块的最外层作用域使用import和export，不可在条件语句中使用，也不能在函数作用域中使用import。
（完）
本文参与 腾讯云自媒体分享计划，分享自微信公众号。
原始发表：2018-10-24，如有侵权请联系 cloudcommunity@tencent.com 删除
评论
登录后参与评论
推荐阅读