年少无知,瞎玩王者。技能太少,知识太老。学校不收,企业不要。三千实习,狗都不干。腹中悲鸣,前端汪汪。
前端模块化:ES6,CommonJS
前言
模块化是一种处理复杂系统分解为更好的可管理模块的方式。人力有限,一个大问题搞不来,拆成若干小问题还搞不来?更何况拆开还能分工合作。
提示:以下是本篇文章正文内容,下面案例可供参考
一、CommonJS语法
注意node.js使用的是CommonJS。
1.CommonJS导出:
//CommonJS导出:
module.exports = {
flag:true,
test(a,b){
return a + b;
},
demo(a,b){
return a * b;
}
}
2.CommonJS导出
//对象解构赋值:
let { test,demo,flag} =require('moduleA');
//等同于:
let _mA = require('moduleA');
let test = _mA.test;
let demo = _mA.demo;
let flag = _mA.flag;
二、ES6语法
1.ES6导出
vue中多使用ES6:
//ES6导出:
exports = {
flag:true,
test(a,b){
return a + b;
},
demo(a,b){
return a * b;
}
}
2.ES6导入
//ES6导入:
//对象解构赋值
import {test,demo,flag} from './moduleA';
//另类全导出作为对象aaa
import * as aaa from './moduleA';
//使用:console.log(aaa.flag);
总结
CommonJS用 module.exports{} 导出,用 require 导入;
ES6用 exports{} 导出,用 import 导入。