首页 > 其他分享 >commonJs和ESModule的区别

commonJs和ESModule的区别

时间:2024-09-18 10:27:27浏览次数:1  
标签:语句 commonJs 区别 ESModule 导入 模块 CJS ESM 加载

1. 规范的区别

ESM模块的导入使用Import关键字,导出使用export关键字。

commonJs导入使用require关键字,导出使用module.export

 

2. 文件名后缀不一样(这一点不用记,针对Node)

在node.js,默认将 .js后缀文件识别为CJS模块,.cjs也是CJS模块 ,.mjs文件识别为esm模块。

 

3. 模块加载时机不一样

CJS支持动态加载模块(require语句可以出现在任意位置)

ESM是静态解析的,它会在所有模块都加载完毕后才执行代码,在编译时首先解析模块中的导入语句,虽然通常会将导入语句放在模块的顶部,但并不是要求所有的import语句必须在文件的顶部,只要在使用导入的内容之前进行导入即可。

因此ESM可以在代码执行前进行静态分析和优化,从而提高性能(比如自动移除无用的死代码,webpack的treeshaking就是利用了这点)带你了解 Tree Shaking - 掘金 (juejin.cn)

而CJS需要等到代码允许时才能确定依赖关系和加载模块。

 

4. 导出内容的区别

ESM导入的是值的引用,而CJS导入的是值的拷贝

 

参考:

Node.js 入门教程 - 粥里有勺糖 - 掘金小册 (juejin.cn)

标签:语句,commonJs,区别,ESModule,导入,模块,CJS,ESM,加载
From: https://www.cnblogs.com/yaoyu7/p/18418025

相关文章

  • 自旋锁(Spinlock)和互斥锁(Mutex)的区别
    自旋锁(Spinlock)和互斥锁(Mutex)的区别自旋锁(Spinlock)和互斥锁(Mutex)都是用于多线程或多进程环境中同步共享资源的机制,但它们的工作方式和使用场景存在显著的不同。1.自旋锁(Spinlock)原理:当一个线程试图获取自旋锁时,如果锁已经被其他线程占有,它会一直循环检查(自旋)锁的状态,直到锁......
  • [Vue] v-html、v-show、v-if 的区别
    v-if作用:根据条件动态创建或销毁DOM元素。原理:v-if实际上是按需渲染的,它会根据表达式的真假值来决定是否在DOM树中插入或移除元素。如果条件为false,该元素不会存在于DOM中。性能:因为v-if会真正地添加或移除元素,因此它在初次渲染时的开销较大,特别是当需要频繁切换时会......
  • Vue2 和 Vue3 区别 — 源码深度解析
    Vue2和Vue3区别—源码深度解析Vue.js作为前端领域中的一款热门框架,其每一次版本迭代都牵动着无数开发者的心。今天,我们将深度解析Vue2与Vue3之间的最主要区别,通过源码对比,带你领略这两个版本背后的奥秘。文章目录Vue2和Vue3区别—源......
  • static 修饰局部变量和全局变量的区别
    static静态全局静态用来修饰变量的static修饰全局变量,修改的是该全局变量的属性(【外部链接】变成【内部链接】)static修饰局部变量,修改的是局部变量的时候,修改的是存储位置(【栈存储区】变成【静态存储区】)用法:修饰局部变量static修饰局部变量的时候,局部变量出......
  • C++面试考点:拷贝赋值运算符和拷贝构造函数有什么区别?
    定义和功能拷贝构造函数拷贝构造函数是一种特殊的构造函数,用于创建一个新对象,该新对象是作为另一个同类型对象的副本而创建的。其函数原型通常为类名(const类名&other)(在C++11之前,const也可省略)。例如:classMyClass{public:MyClass(constMyClass&ot......
  • SOCKS4和SOCKS5的区别是什么?
    SOCKS4和SOCKS5是两种常用的网络代理协议,它们在功能、性能和应用场景上存在一些关键的区别。以下是对这两种协议区别的详细解析:1.支持的协议类型SOCKS4:只支持TCP协议(传输控制协议)。这意味着SOCKS4代理只能用于基于TCP连接的网络应用,对于需要在UDP协议上通信的应用(如在线游戏......
  • Cortex-A7的GIC(通用中断控制器):边沿触发和电平触发中断的区别
    0资料ARM®GenericInterruptControllerArchitectureversion2.0ArchitectureSpecification1边沿触发和电平触发中断的区别1.1边沿触发和电平触发中断官方解释边沿触发(Edge-triggered)Thisisaninterruptthatisassertedondetectionofarisingedge......
  • python- +和+=的区别
     区别:+使用__add__函数,返回新地址+= 可变数据时使用__iadd__函数,返回原地址;不可变数据用__add__函数 不可变数据#不可变数据+和+=都用__add__函数i=10i=i+2print(id(i))i+=2print(id(i)) 可变数据#可变数据+使用__add__函数,返回新地址#......
  • 机器学习和深度学习的区别:从基础到前沿
    随着人工智能(ArtificialIntelligence,AI)的不断发展,机器学习(MachineLearning,ML)和深度学习(DeepLearning,DL)这两个术语变得越来越重要。它们在推动AI技术进步中发挥着关键作用,但对于很多人来说,机器学习和深度学习这两个概念容易混淆。本文将深入探讨机器学习和深度学习......
  • 详解!HTTP1.0/1.1/2.0/3.0的区别
    详解HTTP1.0/1.1/2.0/3.0的区别1.0和1.1有什么区别?响应状态码的区别HTTP/1.0仅定义了16种状态码。HTTP/1.1中新加入了大量的状态码,光是错误响应状态码就新增了24种。比如说,100(Continue)——在请求大资源前的预热请求,206(PartialContent)——范围请求的标识码......