购物网站配色怎么设计,桂林生活网招聘,集团门户网站建设方案 php,莱芜市网站建设模块化的概念
模块化是指将一个复杂的系统分解为多个模块#xff0c;每个模块完成一个特定的功能#xff0c;模块之间通过接口进行通信。模块化的目的是提高代码的可读性、可维护性和可重用性。
模块化规范产品#xff0c; ES6 之前的模块化规范有#xff1a;
CommonJS …模块化的概念
模块化是指将一个复杂的系统分解为多个模块每个模块完成一个特定的功能模块之间通过接口进行通信。模块化的目的是提高代码的可读性、可维护性和可重用性。
模块化规范产品 ES6 之前的模块化规范有
CommonJS NodeJS、BrowserifyAMD requireJSCMD seaJS
模块化的基本语法
导出模块使用 export 关键字导出模块中的变量、函数或类。导入模块使用 import 关键字导入其他模块中的变量、函数或类。
导出模块的方式
默认导出使用 export default 关键字导出一个默认的模块。命名导出使用 export 关键字导出多个命名的模块。
分别导出
export let school 星达网络
export function teach(){console.log(教技能)
}统一导出
//统一暴露
let school 星达网络;
function findjob(){console.log(找工作吧);
}
export {school,findjob}默认导出
//默认暴露
export default {school:ATGUIGU,change:function(){console.log(我们可以改变你)}
}导入模块的方式
默认导入使用 import defaultName from module; 导入默认模块。命名导入使用 import { name1, name2 } from module; 导入多个命名模块。全部导入使用 import * as name from module; 导入模块中的所有内容。
1. 默认导入只针对默认暴露
import m3 from ./src/js/m3.js2. 命名导入 解构赋值方式
import {school,teach} from ./src/js/m1.js
import {school as guigu,findJob} from ./src/js/m2.js
import {default as m3 } from ./src/js/m3.js3. 全部导入
import * as m1 from ./src/js/m1.js
import * as m2 from ./src/js/m2.js
import * as m3 from ./src/js/m3.js4.HTML中引入
script src./src//js/app.js typemodeule/script示例代码
// m1.js
export let school 星达网络;export function teach() {console.log(我们可以教给你开发技能);
}// m2.js
let school 星达网络;function findJob() {console.log(我们可以帮助你找工作!!);
}export { school, findJob };// m3.js
export default {school: ATGUIGU,change: function() {console.log(我们可以改变你!!);}
}// app.js
import * as m1 from ./m1.js;
import * as m2 from ./m2.js;
import * as m3 from ./m3.js;console.log(m1);
console.log(m2);
console.log(m3);m1.teach();
m2.findJob();
m3.default.change();
