ES6 模块化(1)

简介:

模块化:将某段独立功能的代码封装为一个模块,在其他模块或代码中导入使用。


模块化可以将一个复杂的程序拆分为若干个模块。

js发明之初,只是一门简单的脚本语言,仅仅用于编写网页脚本,所以没有模块化功能。

在nodejs中,执行的代码都是本地的,所以nodejs实现了模块化功能。使用module.exports导出一个模块,使用require导入模块。

浏览器中运行js,代码资源都是从互联网中异步载入的,所以不可能实现同步模块化。只能通过script标签导入多个js文件,

多个js文件实质上是前后拼接在一起运行的。


这种导入js的方式有两个缺点:
1,由于代码时拼接在一起运行的,所以多个js文件处于同一个全局作用域,可能形成变量名冲突。
2,如果多个js文件有相互依赖的关系,则必须按照依赖顺序先后导入。

随着网站功能越来越来丰富,网页中的js代码量也越来越多,通过script标签导入js文件的缺点越来越明显,所以前端js也迫切的需要模块化技术。

所以有第三方为前端js实现了模块化功能,例如requirejs和seajs。但是,这些前端模块化技术并不是真正的模块化,而是使用ajax请求实现了类

似模块化的效果。


这些第三方实现的前端模块化技术也有不足之处:
1,这些技术是第三方实现的,并不是官方标准。
2,这些模块化技术对于js源代码的格式有一定要求,必须按照要求的格式书写才能使用模块化。


直到ES6,ECMA才推出了官方标准的js模块化技术。使用export 导出,使用import导入。
但是目前没有任何js平台直接支持es6的模块化标准:
1,浏览器由于载入的代码资源是网络中的,所以不可能实现同步模块化。
2,nodejs中已经有了自己的模块化技术,所以没有再支持es6的模块化标准。
目录
相关文章
|
3月前
|
JavaScript 前端开发
说说你对ES6模块化的理解?和commonJS的区别?
ES6模块化(也称为ES2015模块化)是ECMAScript 6中引入的一种模块化规范,用于在JavaScript中组织和管理代码。它提供了一种更优雅和强大的方式来定义、引入和导出模块。
20 0
|
4月前
|
JavaScript
JS模块化规范之ES6及UMD
JS模块化规范之ES6及UMD
33 3
|
5月前
|
JavaScript 前端开发
ES6模块化
ES6模块化
18 0
|
5月前
|
编解码 JavaScript 前端开发
ES6 模块化编程 详解
ES6新特性 模块化编程详解。
58 0
|
8月前
|
JavaScript 前端开发
深入了解前端开发规范的区别《Commonjs、AMD、CMD、ES6模块化》
深入了解前端开发规范的区别《Commonjs、AMD、CMD、ES6模块化》
69 0
|
8月前
|
JavaScript 前端开发
说说你对JavaScript模块化方案的理解和 CommonJS、AMD、CMD、ES6 Module 分别是什么?
模块化是指将一个复杂问题,自顶向下逐层把系统划分为若干模块的过程。对于整个系统来说,这些模块可组合,分解和更换的单元。对于编程领域的模块化就是遵守固定的原则,将一个大文件拆分成多个独立且相互依赖的小模块。简单理解模块化就是在一个js文件中能够引入另一个js文件
|
9月前
|
JavaScript 前端开发
模块化开发:CommonJS、AMD 和 ES6 Modules 的区别与使用方式
在前端开发中,模块化开发是一种重要的编程方法,它可以帮助我们更好地组织和管理代码,提高代码的可维护性和复用性。在JavaScript中,有多种模块化开发的标准,包括CommonJS、AMD和ES6 Modules。让我们逐一了解它们的区别和使用方式:
110 0
|
10月前
|
JavaScript
|
缓存 自然语言处理 JavaScript
commonJS和ES6模块化的区别
在 ES6 之前,社区制定了一些模块加载方案,最主要的有 CommonJS 和 AMD 两种。前者用于服务器,后者用于浏览器。ES6 在语言标准的层面上,实现了模块功能,而且实现得相当简单,完全可以取代 CommonJS 和 AMD 规范,成为浏览器和服务器通用的模块解决方案。