菜鸡第一次接触前端,才了解到有两种模范标准。
一.CommonJS标准:module.exports、exports
每个文件就是一个模块,有自己的作用域。在一个文件里面定义的变量、函数、类,都是私有的,对其他文件不可见。
CommonJS规范规定,每个模块内部,module变量代表当前模块。这个变量是一个对象,它的exports属性(即module.exports)是对外的接口。加载某个模块,其实是加载该模块的module.exports属性。
1.暴露接口:
将一些公共的代码抽离成为一个单独的 js 文件,作为一个模块。模块通过 module.exports对外暴露接口。
这有好几种写法:
//module.js
var a=1;
b=function(a){
return a+1};
};
module.exports.a=a;
module.exports.add=add;
module.exports={a:a};
也可以exports.a=a;
因为CommonJS标准中,给每个模块头部提供一个exports变量(内部实现:var exports = module.exports
)
2.调用接口:
在需要使用这些模块的文件中,使用 require 将公共代码引入。
var date=require('../module.js');
console.log(date.a);//1
console.log(date.b(1));//2
二.ES6标准:export,import,export default(直接在变量或者函数头前面加上export)
ES6规定必须与模块内部的变量建立一一对应关系。
1.暴露接口:
//module.js
var a=1;
b=function(a){
return a+1};
};
var c=2;
export var d=3;
export{a,b,c};
export{a as aa,b as bb};//as是别名,import的时候还是选取别名
2.调用接口:
import{a,b,c} from '../module.js'
import{aa,bb} from '../module.js'
**
注意微信小程序中import
只能使用相对路径!!!
**