前端模块化:Commonjs与ES6的区别

模块化

模块化就是将变量或函数 放入不同的文件中

模块的作用域是私有的 内部定义的代码只能在当前文件中使用 外部使用那么需要将此模块暴露出去

模块化的好处

减少全局变量 避免变量名和函数命名冲突

提高代码的复用性和维护性

CommonJS

node使用的是commonjs ,在使用模块的时候是运行时同步加载的 ,拷贝模块中的对象

模块可以多次加载,但只会在第一次加载 之后会被缓存 引入的是缓存中的值

引入使用:require("path")

1.如果是第三方模块 只需要填入模块名

2.自己定义的模块 需要使用相对路径或者绝对路径

导出模块使用:exports.xxx 或 module.exports.xxx 或 module.exports=xxx 或 this.xxx

!!不管是使用 exports 还是 this ,都需要用点语法的形式导出,因为 他们两个是module.exports的指针 重新赋值将会切断关联

Es6 模块

默认导出 export default 变量或者函数或者对象

默认引入 import name from "相对或绝对路径"

导出的名字和引入的名字可以不一致

按需导出 export 需要声明 变量用const / var / let 函数用function

按需引入 import {变量名或函数名} form "文件路径"

全部引入 使用  import * as 自定义name "文件路径"



猜你喜欢

转载自blog.csdn.net/m0_46833693/article/details/123169194