js的import 与export详解

Posted 2020-11-08 jack-liu6

ES6

1.export default

其他模块加载该模块时，import命令可以为该匿名函数指定任意名字。

如：

import Vue from ‘vue‘

vue里面的第三方模块都是用了这个

使用import 不带{ }如上，一定要用export default 导出，不能用export导出；

显然，一个模块只能有一个默认输出，因此export default命令只能使用一次。

export defalut 只能用import boy from ‘模块路径‘，不能带{}

所以，import命令后面才不用加大括号，因为只可能唯一对应export default命令。

输出一个叫做default的变量，对外借口就为default

2. export

export 导出的一定是类对象的像是

如：

export var name = "liuyang"
或
var boy = ‘liuyang‘
export {boy}
或
var boy = ‘liuyang‘
var gril = ‘guo‘
export {boy, girl}

这时在导入时也一定要import {boy} from ‘模块路径‘

export本质是暴露出对外的接口，它们的实质是，在接口名与模块内部变量之间，建立了一一对应的关系。

3. import

使用export命令定义了模块的对外接口以后，其他 JS 文件就可以通过import命令加载这个模块。

如：

import  {boy} from ‘模块路径‘

大括号里面的变量名，必须与被导入模块对外接口的名称相同，

import后面的from指定模块文件的位置，可以是相对路径，也可以是绝对路径，.js后缀可以省略。

如果只是模块名，不带有路径，那么必须有配置文件，告诉 javascript 引擎该模块的位置。

Node 

1.exports

如：

 

var boy = ‘liuyang‘
exports.boy = boy

 

exports.‘接口名‘ = 对象

导入时，用var ex = require(‘模块路径‘)，加载模块就可以用ex.boy调用接口

2.module.exports

用于直接导出对象可以直接用

//-------test.js------
var boy = ‘liuyang‘
module.exports = boy

------------main.js-------
var b = require(‘./test‘)
console.log(b)
//------结果liuayang----