ES6基础语法之模块化

模块化,每个js文件就是一个独立的模块,需要再别的文件引用就需要模块的导入与导出

比如我希望在a.js中使用b.js的变量或者函数,那么ES6就中模块化就帮到咱们啦!

模块导出

b.js

var name="十月梦想";
var age=18
var sex="男"

function add(x,y){
	return x+y
}
export {name,age,sex,add}

exports {name1,name2,....namen}

模块导入

可以把文件中的变量导出,然后提供其他文件使用

需要引用上述的变量在a.js要先进行导入

a.js

import {name,sex,age,add} from "./b.js"
console.log(name,age,sex,add(5,8))

模块使用

这样就可以使用b.js的文件!在需要引用的地方使用script引用记得js的type类型为"module",

		<script src="./a.js" type="module"></script>

实际开发过程中总是出现各种问题,比如模块中的变量名已经被使用了该怎么处理,怎么修改模块中变量的名字呢,

可以使用 {原来模块变量名字 as 新名字} 这样方式!

实例代码

import {name,sex,age,add as js} from "./b.js"
console.log(name,age,sex,js(5,8))

这样在模块文件中的add变量被成功修改为js了,再次调用这个add则提示名字修改报错,只能使用以及修改完成的js这个新名字!