JavaScript

JavaScript 模块的导入与导出

js模块的产生是便于代码的复用，可以从一个程序导出也可以导入到另一个程序中使用。

- 代码的可维护性和易用性提高；

- 复用代码的逻辑框架

- 保护模块也保护不受其他模块影响

- 解决命名空间问题和命名冲突问题

一、模块`modules`的导出

模块导出可以使用module.exports来导出

let Animal ={}  //定义一个代表模块的对象Animal.name = 'dog'  //添加模块的属性Animal.age = 1module.exports = Animal  //将Animal对象作为模块导出，其中module代表了这一模块，exports将这一模块作为对象导出。//--------------------------------------//另一中导出的方法，利用module.exports={code集合}来定义需要导出的属性和方法,定制let plant = {}  //同样定义一个对象代表导出的模块module.exports{    name: 'flower',    age : 1,    showName(){console.log(this.name)}, //使用this指针指代导出的对象。//注:对象的函数定义可以使用函数表达式，也可使用es6新方法》》但箭头表达式有疑问《《？？//注：两种导出方法不要混用}//--------------------------------------//es6中导出模块可用export default代替module.exportslet Micro = {    name: 'cell',    age: 'days',    exportName: function(){   return this.name},}export default Micro  //利用export default 来代替先前的module.exports//注：此时导入模块需要使用 import moduleNameVar from './modulefilename',无需js后缀，import name可以自定义//--------------------------------------//第四种方法称为命名导出named export，无需定义模块对象。直接将需要的数据函数对象变量导出即可，此方法得名于直接导出相应变量名。let sea = ['red sea','mediterranean sea']function showName(){   console.log(sea[1])}export {sea, showName} //直接导出对应的变量名，可分行写导出多次多个变量//--------------------------------------//第四种方法可以直接在变量名前加注 关键字export 注明为可导出变量export let sky = 'blue'export function show(){   console.log(sky)}//之间将变量名expose出去即可使用，export关键字标明了变量可以导出的属性 //导入变量时同样需要import {name}形式来导入//--------------------------------------//第五中方式是别名导出的方式 export {varName1 as alias，varName2 as alias2...}let animnalName = 'dog'function showAnimal(name){   console.log(name)}//先定义变量与函数对象，随后利用别名导出export {animalName as Aname, showAnimal as showA}   //此时用Aname指代了animalName，showA指代了showAnimal()

导出模块共分为三步：

- 定义一个表示模块的对象

- 为模块添加数据和方法（func）

- 导出模块module.exports

二、模块的导入`require()`

利用require()函数导入模块，从而可以外部控制模块内部的数据和行为。

const Animal=require('./animal.js')  //从animal.js这个文件中导入模块，需要用const定义一个变量来接收导入的模块，常量的命名自由console.log(Animal.name)  //操作模块内部的数据//--------------------------------------//当使用export default 形式导出时import moduleNameVar from './modulefilename'  // 需要使用import 的形式导入，其中moduleNameVar即为导入后代表模块的变量名，无需后缀//--------------------------------------//当使用export {varName1,varName2,...}形式导出时import {varName1,varName2,} from 'moduleFilePath/Name'   //从文件名导入无需js后缀//import {} 可以分行写导入，多次导入多个模块变量//--------------------------------------//当变量直接export前缀时，可以直接导入变量名，与上同import {varName1,..} from 'moduleFileName'//导入的变量名包含了方法和属性数据，可以直接通过变量名访问使用//若导出时使用了混合导出，既有export {}，也有export default obj，//function isAnimalWow() {};//export default isAnimalWow;//则导入时需要另起一行import 导入default的对象//--------------------------------------//别名导入的方式 import 别名 from 'moduleFile'import {var_alias1,...} from './menu';//若没有用export导出别名，而是直接导出全名，则可利用import var1Name as alias来导入impot {varName1 as alias1，varName2 as alias2,...} from './moduleFileName'//--------------------------------------//整体导入，将所有的变量作为整体别名模块导入，类似pythonimport * as Alias from 'moduleFileName'

导入模块主要分为两步：

- require('module/path')或者import导入模块所在js文件；

- 可以利用函数、表达式操作代表模块的const变量，从而操作模块内部的属性数据和方法。