当前位置: 首页 > Web前端 > HTML5

深入理解ES6《用模块封装代码》

时间:2023-04-05 00:58:02 HTML5

什么是模块模块自动运行在严格模式下,没有办法退出正在运行的Javascript代码。模块顶部this的值为undefined,模块不支持html风格的代码注释,除非使用default关键字。否则,您不能使用此语法导出匿名函数或类。任何未显式导出的变量、函数或类都是模块私有的,不能从模块外部访问。import{identifier1,identifier2}from'./example.js'import大括号表示要定义模块导入的绑定,文件必须具有文件扩展名以及扩展名列表。导入的绑定列表看起来类似于解构对象,但事实并非如此。从模块导入绑定时,就像使用const定义一样。同样无论一个模块在import语句中写了多少次,该模块只会被导入一次。导入模块的代码执行后,实例化的模块保存在内存中,只要有其他导入语句引用它就可以重复使用。导出和导入的一个重要限制是它们必须在其他语句和函数之外使用。即不允许出现在if语句中,不能有条件地导出,也不能以任何方式动态导出。模块语法存在的原因之一就是让JS引擎静态的决定什么可以导出,所以只能在模块的顶部使用export。export,import可以用来重命名导出的函数。sum(num1,num2){returnnum1+num2}//exportdefaultsumexport{sumasdefault}看下面的例子:exportletcolor='red'exportdefaultfunction(num1,num2){returnnum1+num2}importsum,{color}from'./example.js'import和export结合使用export{sumasadd}from'./example.js'