y由于js文件过多,导致一些变量名相同导致冲突。以前大多用闭包形式解决。当其他文件要引用此文件的变量方法时定义一个对象里面包含要传出的变量和方法,并把对象进行返回。这就是最基本的模块化封装。现在越来越多人开始使用模块化思想开发。
ES模块化的导入导出
导出用export,
导出的方式1
const name=‘yu’;
export{
name
}
导出的方式2
export onst name=‘yu’;
导出函数/类
export function aaa(){
name=‘123’
}
导出的方式3 :
当导出的变量和方法希望别人调用时可以进行重新命名用export default,且只能导出一个变量或者方法
const name='111'
export default name
export default function(){
name=‘123’
}
导入方法:
导入时必须在html文件里导入js文件时定义type类型为module
<script src='.mo.js' type='module'></script>
导入使用import
直接导入export定义的变量或者方法
import {name,aaa} form "./mo.js"
导入export default的内容
import add from "./mo.js" add为新定义的名字
如果一次导入的东西太多可以统一全部导入
import *as aaa from "./mo.js" aaa为定义接收的名字,调用时写aaa.name
console .log(aaa.name);