传统的非模块化编程开发:
1.命名冲突
2.文件依赖
es5
es6
两种模块化编程的使用
写法多种,知识点不多
很重要
CommonJS模块化编程 ES5的写法
每个js文件都是一个模块,有自己的作用域,在文本中定义变量
对象,函数,变量,常量
把原本的一个文件引入到另外一个文件中
//导出模块和数据
一个js文件,我们可以把他看作一个对象模块
module.export={
对象
函数
}
另外一个文件中导入文件
//导入模块,在原本的那个文件就可以看作成为一个对象
把导入的东西可以看作定义成为一个对象,这样的话,我们就可以去看作一个或者多个对象去以OOP的观点去调用多个属性
这样的话,我们就可以知道两个文件模块之间的调用了
在传入的过程中是可以识别到的
es6模块化编程
批量导出形式
第一种
批量导出
导出的三个数据不一定全都需要
可以全部的接收,也可以去选择性的接收
导入的名字和导出的名字是要保持一致的,如果用一个别的名字去接收的话这样是接收不到的
其他导出形式
在定义函数的时候就可以直接导出
没有导出的数据是不可以直接导入的,而且是要去保证这个名字也要是一致的
要保证名称一致
默认导出
export default
把整个的一个大块当作一个对象,把整个的一个大括号当作一个对象多出
//m.xx,这个地方前面去指定的导出的对象的名称是可以自己去指定的
就可以去解决命名冲突的问题
小结一下!!!!!
注意事项和细节
es6中我们所编写的语句不会可以直接的执行,需要我们先进行一个转化
import 语句是可以具有多个的
export语句不仅可以去导出对象,一切的js变量都可以进行相应的导出
没有导出的对象是不可以使用的
es6的导出方式很多,不同的导出方式对导入方式也是具有一定的影响
要按照原本的语法进行的、
对于es6的导出重点我们要去掌握
定义方法的同时进行相关的导出
这一种的导出方式,对于对象名我们是可以自己去定义的
默认导出是很重要的
只有使用默认导出的时候,default方式,这样我们就可以在import中由程序员自己去定义相关的名字不需要去依赖相关的前端人员所设定的名称
默认导出的时候,
就是要把相关的对象整体抱起来
不需要去使用这个let了
导出的时候我们设置的相关的对象也同样是可以看作是一个对象的,我们通过不断地进行相关的调用,最终我们就可以拿到相关的属性值