什么是模块?
本课属于 Coddy JavaScript 学习旅程的“面向对象编程”单元。第 7 课,共 56 课。
当你的 JavaScript 代码变得庞大而复杂时,很难在一个文件中管理所有内容。解决办法是使用模块:把代码拆分到多个独立且井然有序的文件中。
模块是包含相关代码的 JavaScript 文件。每个模块负责一项特定任务,让你的应用程序更容易理解和维护。
JavaScript 模块是一种普通的 .js 文件,可以 export 代码(变量、函数、类),供其他文件 import 并使用。
示例:
一个杂乱的文件:
// 文件:messy-app.js
let user = "John";
let score = 0;
function login() {
console.log("Welcome " + user);
}
function addPoints(points) {
score += points;
}使用模块组织的两个文件:
// 文件:user-module.js
let user = "John";
function login() {
console.log("Welcome " + user);
}
// 文件:game-module.js
let score = 0;
function addPoints(points) {
score += points;
}user-module.js:它负责处理用户身份验证和用户相关数据,并包含用户名和登录功能。
game-module.js:它负责管理游戏的计分和积分系统,跟踪分数并处理积分计算。
挑战
简单你已经连接了两个模块:user-module.js 和 game-module.js。
你的任务是在 user-module.js 中使用值 10 调用 addPoints 函数。
预期输出:
Score increased! Current score: 10
亲手试试
import { addPoints } from './game-module.js';
let user = "John";
// TODO:用值 10 调用 addPoints 函数
这节课包含一个小测验。开始学习即可作答,并记录你的进度。
面向对象编程中的所有课
8整理 OOP 代码
将类组织到模块中自己练习: JavaScript 在线编译器