javascript 模块调用 js 引入模块

Node 中的导入导出方式

此类导入方式借助module对象通过module.exports赋予 js 文件中某数据类型能够被导入的权限，通过require(<filename>)导入数据类型，这种导入方式主要在 Node.js2 中使用。每个运行在 Node 上的 js 文件都存在一个有导出属性的本地module对象。require(<filename>)赋予的变量名不必须与导出文件中的变量相同，原则上保持一致。

基本方式

导出文件 <1-airplane.js>

let Airplane = {};
Airplane.myAirplane = "StarJet";
module.exports = Airplane;

导入文件与模块文件位于同一目录

const Airplane = require('./1-airplane.js');
const displayAirplane=()=>{
  console.log(Airplane);
  console.log(Airplane.myAirplane);
}
displayAirplane();

匿名方式

此类导入方式依赖了JavaScript语言变量是引用的特性，直接在module.exports后定义数据类型。

导出文件 <2-airplane.js>

module.exports = {
  myAirplane:"CloudJet",
  displayAirplane:function(){
    return this.myAirplane;
  }
};

导入方式同上。

ES6 中的导入导出方式

default 方式

此类导出方式利用了 ES6 中的特性，可读性、灵活性高，通过export default替换module.exports。

导出文件 <airplane.js>

function meetsSpeedRangeRequirements(maxSpeed, minSpeed,requiredSpeedRange){
  const range = maxSpeed - minSpeed;
  if (range>requiredSpeedRange){
    return true;
  }
  else return false;
}
export default meetsSpeedRangeRequirements;

导入文件 (值得注意的是，此时导入方式中不存在.js后缀)

import meetsSpeedRangeRequirements from './airplane';

Named 方式

这种导入方式实现了多个数据类型的导入。此时导出与导入文件中数据类型的变量名必须相同。

• 一次性导出或导入
  导出文件 <airplane.js>

let availableAirplanes=[
  {name:'AeroJet',
  fuelCapacity:800,
  maxSpeed:1200,
  minSpeed:300,
  availableStaff:['pilots', 'flightAttendants',    'engineers', 'medicalAssistance','sensorOperators']
  },
  {name:'SkyJet',
  fuelCapacity:500,
  maxSpeed:800,
  minSpeed:200,
  availableStaff:[
  'pilots','flightAttendants'
]}];
let flightRequirements = {
};
function meetsSpeedRangeRequirements(maxSpeed, minSpeed,requiredSpeedRange){
}
function meetsStaffRequirements(availableStaff,requiredStaff){
}
export {availableAirplanes, flightRequirements,meetsStaffRequirements};

导入文件

import {availableAirplanes, flightRequirements,meetsStaffRequirements} from './airplane';

• 逐个导出或导入
  导出文件 <airplane.js>

export let availableAirplanes=
    [
  {
      name:'AeroJet',
  	  fuelCapacity:800,
  	  maxSpeed:1200,
  	  minSpeed:300,
  	  availableStaff:['pilots', 'flightAttendants',    'engineers', 'medicalAssistance','sensorOperators']
  },
  {
      name:'SkyJet',
  fuelCapacity:500,
  maxSpeed:800,
  minSpeed:200,
  availableStaff:[
  'pilots','flightAttendants'
]}];

导入方式同前一个。

起别名

此类导入方式基于 named 一次性导出或导入方式，通过 as 关键字给变量起别名。

导出文件 <airplane.js>

export {availableAirplanes as aircrafts, flightRequirements as flightReqs,meetsStaffRequirements as meetsStaffReqs,meetsSpeedRangeRequirements as meetsSpeedRangeReqs};

导入方式

1. 基本导入方式同前一个
2. 起别名导入，参考导出方式
3. 对整个导入模块起别名

import * as Carte from './menu';
Carte.chefsSpecial;
Carte.isVeg();
Carte.isLowSodium();

组合方式

default方式与named方式可以组合使用。

导出文件 <airplane.js>

export let availableAirplanes=[
  {name:'AeroJet',
  fuelCapacity:800,
  maxSpeed:1200,
  minSpeed:300,
  availableStaff:['pilots', 'flightAttendants',    'engineers', 'medicalAssistance','sensorOperators']
  },
  {name:'SkyJet',
  fuelCapacity:500,
  maxSpeed:800,
  minSpeed:200,
  availableStaff:[
  'pilots','flightAttendants'
]}];
export let flightRequirements = {
};
function meetsSpeedRangeRequirements(maxSpeed, minSpeed,requiredSpeedRange){
}
export function meetsStaffRequirements(availableStaff,requiredStaff){
}
export default meetsSpeedRangeRequirements;