js模块化

一、模块化是什么？

模块化就是将一个大型项目，拆分成多个小模块，模块间相互隔离。

例如：一个文件可以是一个模块，各文件间数据不能共享。

模块化的好处：

1.避免全局污染（命名冲突）：许多变量都在一个文件中，那难保会有一样的名字，比如许多个图片都叫img，信息都叫msg。

2.避免依赖混乱：一个模块只要管好自己就行了，自己依赖哪些模块中的数据，和自己哪些数据被其他模块依赖。

3.保证数据安全：各模块隔离，隐私数据可以不被外界访问到，保证了数据安全。

二、两大模块化规范

CommonJS-----------------------多用于服务器端

      ES6       -----------------------多用于浏览器端

1.CommonJS

require 和 exports 关键字

导入

require('./student.js')

导出

//student.js

const name = '阿尼亚'

const age = 6

exports.name = name

module.exports = {age}

 

2.ES6

import 和 export 关键字

导入

import * as student from './student.js'

import {name} from './student.js' //单独导出或统一导出时

import age from './student.js'  //默认导出时

导出

//student.js

export const name = '阿尼亚'  //单独导出

export default const age = 6  //默认导出

export {name,age}  //统一导出

注：导入的内容被当作常量，不能修改。但是ES6的导出规则是浅拷贝，有一定安全问题。