「这是我参与11月更文挑战的第13天,活动详情查看:2021最后一次更文挑战」
模块化
在复习import和require之前,我们首先了解一下模块化
在我们早期编写JavaScript时,我们只需要在script标签内写入代码就可以满足我们页面交互的需要。但随着时间的推移,原本的那种简单粗暴的编写方式所带来了一系列问题,如:页面复杂,逻辑混乱,可维护性差,全局变量暴露,为了解决这些问题提出了很种的解决方案,其中之一就是JavaScript模块化编程。总的来说,它有以下几个优点:
- 开发效率高,有利于多人协同开发。
- 职责单一,方便代码复用和维护 。
- 解决项目中的全局变量污染的问题。
- 解决文件依赖问题,无需关注引用文件的顺序。
在ES6标准发布后,module成为标准,标准的使用是以export指令导出接口,以import引入模块,但是在我们一贯的node模块中,我们采用的是CommonJS规范,使用require引入模块,使用module.exports导出接口
import
import是es6为js模块化提出的新的语法,import (导入)要与export(导出)结合使用
require
require是CommonJS的语法,CommonJS的模块是对象,输入时必须查找对象属性
区别:
-
遵循规范不同 require 是AMD规范引入方式 import是es6的一个语法标准,如果要兼容浏览器的话必须转化成es5的语法
-
时间调用上不一致 require是运行时调用,所以require理论上可以运用在代码的任何地方 import是编译时调用,所以必须放在文件开头
-
本质区别:
require是赋值过程,其实require的结果就是对象、数字、字符串、函数等,再把require的结果赋值给某个值
- 变量不同 import是解构过程,但是目前所有的引擎都还没有实现import,我们在node中使用babel支持ES6,也仅仅是将ES6转码为ES5再执行,import语法会被转码为require