Import,Require以及Export

都是为了js模块化编程

遵循规范

• require 是AMD规范引入方式
• import 是es6的一个语法标准，须要转换成es5的语法才能兼容浏览器

调用时间

• require是运行时调用，因此require理论上能够运用在代码的任何地方
• import 是编译时调用，因此必须放在文件头部

本质

• require 是赋值过程，其实require的结果就是对象、数字、字符串、函数等，再把require的结果赋值给某个变量
• import 是解构过程，可是目前全部的引擎都还没用实现import，因此须要babel进行转码，把import转码为require

require/exports写法

• node中导入模块

var a = require('a')
const fs = require('fs')
复制代码

• node中向外暴露成员的形式

exports.fs = fs
module.exports = fs
复制代码

import/export写法

导入

• ES6中 导入模块

<!--import 模块名称 from '模块标识符' -->

import utils from 'utils'
import {default as newName} from 'utils'
import * as newName from 'utils'
import {isPhone} from 'utils'
import {isPhone as isPhone2} from 'utils'
import utils, {isPhone} from 'utils'
复制代码

导出

• ES6中，使用export default 和 export 向外暴露成员

export default utils
export const utils
export function utils
export { isPhone, isObject }
export default a
export a
复制代码

Export番外

export default和export const

export default 是默认导出
export const 是命名导出

Default Export (export default)

每一个文件均可以有一个默认导出 export default，导入此类文件时须要指定一个任何你喜欢的名称。例如：

import Func1 from './Func1'
复制代码

Named Export (export)

每一个文件能够有多个命名导出 export const，而后将你要导入的名称用花括号包住。例如：

// 导入多个导出
import { MyClass, MyOtherClass } from "./MyClass1"
// 使用 as 重命名导出
import { MyClass2 as MyClass2Alias } from "./MyClass2"
// 导入全部
import * as MyClasses from "./MyClass1"
复制代码

注意

默认导出实际上就是一个名字为 default 的命名导出，因此也能够像这样导入：

import { default as MyDefaultExport } from "./MyFileWithADefaultExport";
复制代码

tips

1. export default 向外暴露的成员，能够使用任意变量来接收

2. 在一个模块中，export default 只容许向外暴露一次

3. 在一个模块中，能够同时使用export default 和export 向外暴露成员

4. 使用export向外暴露的成员，只能使用{  }的形式来接收，这种形式，叫作【按需导出】

5. export能够向外暴露多个成员，同时，若是某些成员，在import导入时，不须要，能够不在{ }中定义

6. 使用export导出的成员，必须严格按照导出时候的名称，来使用{ }按需接收

7. 使用export导出的成员，若是想换个变量名称接收，能够使用as来起别名