1模块化
在ES6出来之前,社区制定了一套模块化规范;
Common.js 主要是服务段 node.js require(‘http‘)
AMD requireJS,curlJs
CMD seajs
ES6出来以后,规范了服务端和客户端规范
import (xxx) from ddd
1).如何定义模块,如何使用
html中
<javascript type="module">
这里面使用一些模块化的东西
</javascript>
具体实现
先写一个1.js
export const a=12;
<javascript type="module">
import {a} from "./1.js";
</javascript>
import 的特点:
a). import 可以是相对路径,也可以是绝对路径
import "../jquery.js"
import {a} from "./1.js"
b).import 模块化只会导入一次,无论引入多少次
import {a} from "./1.js"
import {a} from "./1.js"
c).import "./modules/1.js" 相当于引入这个文件
2) 多个变量
1.js
export const a=12;
export const b=5;
export const c=30;
import {a,b,c} from "1.js"
const a=12;
const b=5;
const c=30;
export {
a as aaa,
b as bbb,
c as ccc
}
import {aaa,bbb,ccc} from "1.js"
import * as mod from "1.js"
注意
1.js
export default 12;
import a from "1.js"
如果1.js中是export default 这种形式的
import 这个就没有{}这个符号了
1.js
export default 12;
export const b=13;
export const c=15;
import a,{b,c} from "1,js"
import 有提升的作用,会提升到最前面
<javascript type="module">
console.log(a)
import {a} from "1.js"
</javascript>
这个时候a是有值的
相当于
<javascript type="module">
import {a} from "1.js"
console.log(a)
</javascript>
导出的模块,如果里面的变了,外面会变化
import 动态引入
import 类似node中的require,可以动态的引入,默认import 语法不能写到if中去
var a=12;
if(a=12){
import {a} from "1.js"
}else{
import {b} from "2.js"
}
这种写法是错误的
正确的写法
import ("1.js).then(res=>{
....
....
})
function sign(sign){
if(sign==1){
return "1.js"
}else{
return "2.js"
}
}
import (sign(1)).then(res=>{
})
按需加载
或者
Promise.all([import("1.js"),import ("2.js"))).then(([mod1,mod2]=>{
})
原文:https://www.cnblogs.com/yuaima/p/13594103.html