经常容易忘记node的模块导入和导出的细节,还有就是上次作业node和前端js导入导出分不清,所以特意进行测试记录
node中模块导入和导出
module
node中的module对象,通过console.log(),可以看到以下结果
Module {
id: '.',
exports: {},
parent: null,
filename: 'D:\vscode_work\houduanwork\test\test.js',
loaded: false,
children: [],
paths:
[ 'D:\vscode_work\houduanwork\test\node_modules',
'D:\vscode_work\houduanwork\node_modules',
'D:\vscode_work\node_modules',
'D:\node_modules' ] }
module.filename 模块的文件名,带有绝对路径。
module.loaded 返回一个布尔值,表示模块是否已经完成加载。
module.parent 返回一个对象,表示调用该模块的模块对象。
module.children 返回一个数组,表示该模块要用到的其他模块对象。
module.exports 表示模块对外输出的值。
module.exports和exports
module.exports={a:”1”,b:”2”}
exports.a:”1”
exports.b:”2”
module.exports和exports两者结果相同.
本质上两者等同于如下关系。公用同一个对象。
let exports = module.exports;
在新版的node中不支持export和export default。所以在node中文件导出基本就是对module.exports进行操作.
require
//foo.js
var firstName = 'Michael';
var lastName = 'Jackson';
exports.ahh = firstName;
exports.lastName = lastName;
//test.js
const hh = require('./foo');
console.log(hh);
//{ ahh: 'Michael', lastName: 'Jackson' }
require接受的是对应的module.exports中的数据,一般为对象.所以经常用解构赋值获取其中的值.
const {ahh,lastName} = require('./foo');
console.log(ahh,lastName);
//Michael Jackson
require同一个文件多次只有最后一次有效.
导入模块在node中只有require.
在前端js中的模块导入和导出
在非webpack中 大专栏 nodejs和前端js模块导出和引入,在html引入需要引用其他模块的js,需要将 type=”module” 否则
出现Cannot use import statement outside a module
<script src="./test.js" type="module"></script>
export
export导出模块要注意写法,因为export命令规定的是对外的接口,必须与模块内部的变量建立一一对应关系,也就是说必须要提供一个key一个value值。下面的错误写法,本质上都是只提供了一个值。
错误写法:
// 报错
export 1;
// 报错
var m = 1;
export m;
正确写法:
// 写法一
export var m = 1;
// 写法二
var m = 1;
export {m};
同理 function和class的输出,也遵循这种写法
// 报错
function f() {}
export f;
// 正确
export function f() {};
// 正确
function f() {}
export {f};
export可以任意位置,任意多个,但是不能放在块级作用域比如说函数中
import
通过import…from加载模块,变量名必须和接口名一致,可以通过as进行重命名
import {a,b} from "./foo.js"
import {a,b as ahh} from "./foo.js"
import 可以直接去执行被import的模块
test.js
import "./foo.js"
foo.js
console.log("233")
//浏览器中可以看到输出
export default
相比较与export,export default不需要知道所要加载的变量名称。使用import时可以任意命名。
test.js
import ahh from "./foo.js"
ahh()//foo
foo.js
export default function () {
console.log('foo');
}
export default中函数名在模块外部无效。
// export-default.js
export default function foo() {
console.log('foo');
}
// 或者写成 在export中这种写法无效
function foo() {
console.log('foo');
}
export default foo;
export default 本质上就是输出一个default的变量或者方法
// modules.js
function add(x, y) {
return x * y;
}
export {add as default};
// 等同于
// export default add;
// app.js
import { default as foo } from 'modules';
// 等同于
// import foo from 'modules';
因此
// 正确
export var a = 1;
// 正确
var a = 1;
export default a;
// 错误
export default var a = 1;
// 正确
export default 42;
// 报错
export 42;
欢迎指出任何有错误或不够清晰的表达。