ES6模块化与CommonJS模块化

最新推荐文章于 2022-12-12 18:30:44 发布
最新推荐文章于 2022-12-12 18:30:44 发布
阅读量145 收藏
点赞数
分类专栏： 前端 文章标签： webpack 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_47281142/article/details/123227776
版权

阐述模块化（非ES6模块化）应用到浏览器端需要解决哪些问题，如何解决？

  • 浏览器端实现模块化需要解决两个问题：
    a. 浏览器读取JS文件是异步，如何使用异步的方式获取一个模块
    b. 如何避免模块中的全局代码污染全局变量

针对第一个问题，可以使用回调或Promise的方式解决
针对第二个问题，可以手动的将模块放入到函数环境中，避免全局变量的污染

ES6模块化和CommonJS模块化有哪些区别？

a. CommonJS是依赖延迟声明，ES6是依赖预声明
b. CommonJS最终只能依靠module.exports导出，ES6可以有基本导出和默认导出两种方式
c. CommonJS没有绑定再导出的功能，而ES6可以使用 export … from … 进行绑定再导出

虫洞空间
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
《二》.1 - 浏览器端模块化的难题
勤奋的年轻人
01-31 233
浏览器端模块化的难题 CommonJS的工作原理 当使用require(模块路径)导入一个模块时，node会做以下两件事情（不考虑模块缓存）： 通过模块路径找到本机文件，并读取文件内容 将文件中的代码放入到一个函数环境中执行，并将执行后module.exports的值作为require函数的返回结果 正是这两个步骤，使得CommonJS在node端可以良好的被支持 可以认为，CommonJS是...
ES6 --- ES6模块与CommonJS模块
weixin_52723107的博客
09-21 562
ES6模块与CommonJS模块
CommonJS和ES6模块化
qq_41040196的博客
11-19 912
commonjs是node的模块化方式。一般认为， Node.js的模块系统使用了 CommonJS 规范，实际上并不完全正确。Node.js使用了轻微修改版本的CommonJS，因为 Node.js 主要在服务器环境下使用，所以不需要考虑网络延迟问题。require 命令的基本功能是，读入并执行一个 js 文件，然后返回该模块的 exports 对象，这在服务端是可行的，因为服务端加载并执行一个文件的时间消费是可以忽略的，模块的加载是运行时同步加载的，这种规范天生就不适用于浏览器，因为它是同步的。
模块化（CommonJS、ES6中的模块化）
smx_123的博客
12-12 764
前端模块化，CommonJS与ES6模块化的使用与区别
CommonJS 、ES6模块化规范区别
m0_59075169的博客
04-23 2637
CommonJS 、ES6模块化规范区别
CommonJS和ES6模块化的区别
Dax1_的博客
04-10 4333
1，使用环境 CommonJS模块的require语法是同步的，导致CommonJS模块规范只适合用在服务端。因为如果在浏览器端使用同步的方式加载一个模块，需要有网络来决定快慢，响应时间可能会很长。 ES6模块无论在浏览器端还是服务端都是可以使用的，但是在服务端，还需要遵循一些特殊的规则才能使用。 2，输出方式不同 CommonJS输出的是一个值的拷贝 ES6模块输出的是值的引用 CommonJS-值的拷贝 CommonJS输出的是值的拷贝，换句话说，一旦输出了某个值，模块内部后续的变化影响不了外部
CommonJS模块与ES6模块相互加载
龚建华的博客
04-22 1900
本文章学习于阮一峰老师的《ES6标准入门》 1.import 命令加载CommonJS模块 Node采用CommonJS模块格式，模块的输出都定义在module.exports属性上面。在 Node环境中，使用import命令加载CommonJS模块，Node 会自动将module.exports属性当作模块的默认输出，即等同于export default。1.module.exports输...
ES6与CommonJS中的模块处理的区别
10-18
ES6和CommonJS都有自己的一套处理模块化代码的措施，这篇文章主要介绍了ES6与CommonJS中的模块处理的区别，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
ES6 模块化(Module)export和import详解
12-15
在实际开发中，由于浏览器对ES6模块的支持情况不一，通常需要使用打包工具（如Webpack、Rollup或Parcel）将ES6模块转换为CommonJS或UMD格式，以便在各种环境中运行。 总的来说，ES6的模块化通过`export`和`import`...
详解CommonJS和ES6模块循环加载处理的区别
10-17
CommonJS 和 ES6 模块循环加载处理机制是 JavaScript 中两种不同的模块化方案，它们在处理循环加载时有着显著的区别。理解这些差异对于编写可维护的、高效的模块化代码至关重要。 首先，让我们回顾一下 CommonJS 和...
ES6模块化的import和export用法方法总结
11-30
ES6之前已经出现了js模块加载的方案，最...ES6模块主要有两个功能：export和import export用于对外输出本模块（一个文件可以理解为一个模块）变量的接口 import用于在一个模块中加载另一个含有export接口的模块。 也就
模块化(commonJs和ES6 module)
清风的博客
02-24 1088
模块化 模块(Module): 一块具有独立功能的代码,可以是一个函数,一个对象,甚至是一个字符串或者数字,通常存储为一个单独的文件; **模块化出现的原因:**js很难编写大型项目,由于全局变量的污染和难以管理的依赖关系, 这些问题导致了js无法进行精细的模块划分,因为精细的模块划分会导致更多的全局污染以及更加复杂的依赖关系; 1.CommonJs模块化 目前只有node环境才支持CommonJ...
js当中CommonJS 和es6的模块化引入方案以及比较
jackTesla的博客
06-25 3875
在es6之前，对于模块化方案主要是CommonJS和AMD两种。咱们这次说一下ES6和CommonJS的区别。 它们有两个重大差异： CommonJS 模块输出的是一个值的拷贝，ES6 模块输出的是值的引用。 CommonJS 模块是运行时加载，ES6 模块是编译时输出接口。 第一个差异： CommonJS 模块输出的是值的拷贝，也就是说，一旦输出一个...
ES6模块化(对比commonjs模块化)
qq_36303110的博客
11-26 796
ES6模块化 异步加载JavaScript脚本 <script src="path/to/myModule.js" defer></script> <script src="path/to/myModule.js" async></script> <!-- defer是“页面渲染完再执行”，async是“js脚本下载完就执行” --> 浏览器加载ES6模块 使用type = ‘module’ 属于异步加载，等同于打开了defer属性 &lt
CommonJS与ES6的模块化
Luck_ZZ的博客
09-27 371
一、CommonJS nodeJS是commonJS的实现者 在node中，一个js文件就是一个模块；每一个js文件中的js代码都是独立运行在一个函数中，而不是全局作用域，所以一个模块的中的变量和函数在其他模块中无法访问 1.模块定义及引用 定义模块mod01.js： 通过exports来向外暴变量和方法，只需要将需要暴露给外部的变量或方法设置为export的属性即可 /* mod0...
es6模块化和commonjs区别
最新发布
07-27
ES6模块化（也称为ESM）和CommonJS是两种不同的模块化系统，它们在语法和使用方式上有一些区别。 1. 语法差异： - ES6模块化：使用`import`和`export`关键字来导入和导出模块。 - CommonJS：使用`require()`函数来导入模块，使用`module.exports`或`exports`对象来导出模块。 2. 动态 vs 静态： - ES6模块化：模块在编译时就确定了依赖关系，是静态的。这意味着导入和导出的模块路径必须是静态的，不能使用变量或表达式。 - CommonJS：模块在运行时加载和解析，是动态的。这意味着可以使用变量或表达式来动态地导入模块。 3. 加载方式： - ES6模块化：通过`<script type="module">`标签直接在浏览器中加载，或使用构建工具（如Webpack）将模块打包为单个文件。 - CommonJS：主要用于服务器端，通过`require()`函数动态加载模块。 4. 导入方式： - ES6模块化：可以按需导入模块中的具体内容，也可以整体导入。 - CommonJS：导入的是整个模块对象，需要通过对象属性访问具体内容。 需要注意的是，ES6模块化在现代浏览器和最新版本的Node.js中得到了广泛支持，而CommonJS主要用于旧版本的Node.js和一些服务器端应用程序。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值