0Pricing
JavaScript Academy · 课时

模块模式(IIFE)

使用立即调用函数封装代码。

模块模式(IIFE) 是 CoddyKit 上的免费 JavaScript Academy 课时。 这是第 3 节课,共 4 节。 你可以在下方免费阅读本课时的完整内容 — 然后在浏览器中使用内置代码编辑器和全天候 AI 导师进行实践。 这是 JavaScript Academy 学习路径的一部分,你的进度在网页和 CoddyKit 应用中同步。 JavaScript Academy 课程共包含 4 节课。

模块模式解决了什么问题

在 ES 模块出现之前,模块模式可以将相关的状态和行为打包在一起,同时隐藏内部实现并公开简洁的公共接口。它建立在闭包之上。

IIFE

IIFE(立即调用的函数表达式)是定义后立即运行的函数。将函数包裹在括号中并调用它,可以立即创建一个私有作用域。

const result = (function () {
  return 42;
})();
console.log(result); // 42

为什么要立即运行

IIFE 可以为您提供一次性的私有作用域,而不必留下一个具名函数。内部的所有内容都与全局命名空间隔离。

(function () {
  const temp = "not global";
  console.log(temp);
})();
// temp is unreachable out here

返回公共接口

模块模式是一个返回对象的 IIFE。对象的方法是围绕私有变量形成的闭包,共同构成公共接口。

const counter = (function () {
  let count = 0; // private
  return {
    inc: () => ++count,
    value: () => count
  };
})();
counter.inc();
console.log(counter.value()); // 1

私有与公共

在内部声明但未返回的任何内容都会保持私有。只有放在返回对象上的内容才可以访问。

const calc = (function () {
  const pi = 3.14159; // private constant
  return {
    area: (r) => pi * r * r
  };
})();
console.log(calc.area(2)); // 12.56636
console.log(calc.pi);      // undefined

私有辅助函数

辅助函数可以存在于模块内部,供公共方法使用,但永远不会被公开。

const validator = (function () {
  const clean = (s) => s.trim().toLowerCase(); // private
  return {
    isEmail: (s) => clean(s).includes("@")
  };
})();
console.log(validator.isEmail(" A@B.com ")); // true

揭示模块模式

一种流行的变体是先将所有函数定义为私有函数,然后返回一个对象,通过它“揭示”公共函数的引用。这样可以在底部清晰地列出公共接口。

const store = (function () {
  let items = [];
  function add(x) { items.push(x); }
  function count() { return items.length; }
  return { add, count }; // reveal
})();
store.add("a");
console.log(store.count()); // 1

单例

由于 IIFE 只运行一次,模块实际上是一个单例:它只有一个实例和一组私有状态。

const config = (function () {
  let settings = { theme: "dark" };
  return {
    get: (k) => settings[k],
    set: (k, v) => { settings[k] = v; }
  };
})();
config.set("theme", "light");
console.log(config.get("theme")); // "light"

传入依赖

您可以将全局对象或其他模块作为 IIFE 参数传入,从而明确依赖关系,并支持安全的压缩。

const mathUtils = (function (M) {
  return { roundUp: (n) => M.ceil(n) };
})(Math);
console.log(mathUtils.roundUp(4.1)); // 5

避免污染全局作用域

这样做的核心目的,是只使用一个全局名称(即模块),而不是使用几十个松散的变量。这可以防止不同脚本之间发生命名冲突。

与 ES 模块的关系

如今,import/export 在语言层面提供了真正的模块作用域,在很大程度上取代了这种模式。不过,理解 IIFE 模块有助于弄清隐私和封装的工作方式,而且您仍会在旧代码中遇到它们。

快速检查

模块模式和 IIFE。

回顾

模块模式使用 IIFE 创建私有作用域,并返回一个对象,其方法是围绕隐藏状态形成的闭包。内部实现保持私有;只有返回的成员是公共的。揭示模块模式等变体可以让接口更加清晰,模块也会表现为单例。如今,ES 的 import/export 已取代这种模式,但建立在相同的思想之上。

常见问题解答

「模块模式(IIFE)」课时是免费的吗?

是的 — 「模块模式(IIFE)」的完整文本可在网页上免费阅读。要进行交互式练习(内置代码编辑器和全天候 AI 导师)并解锁 JavaScript Academy 课程的其余内容,请升级到 CoddyKit PRO。 JavaScript Academy 课程共包含 4 节课。

「模块模式(IIFE)」这节课中我会学到什么?

使用立即调用函数封装代码。 你通过在浏览器中直接运行的动手代码来练习 JavaScript Academy,全天候 AI 导师会在你学习这节课的过程中回答你的问题。

学习 JavaScript Academy 需要有经验吗?

无需任何先前经验。CoddyKit 上的 JavaScript Academy 课程适合初学者到高级学习者,你可以从这里开始或从头开始,按照自己的节奏学习。 这是第 3 节课,共 4 节。

「模块模式(IIFE)」课时需要多长时间?

大多数 CoddyKit 课程大约需要 5–10 分钟。每节课都很精短且互动,所以你能稳步进步,并在网页和应用中从离开的地方继续。

我能在这节 JavaScript Academy 课中编写并运行代码吗?

能。每节 JavaScript Academy 课都包含内置代码编辑器,你可以在浏览器中直接编写并运行真实代码,并获得即时 AI 反馈 — 无需本地设置。

此课程中的所有课时

  1. 闭包如何捕获状态
  2. 使用闭包创建私有变量
  3. 模块模式(IIFE)
  4. 工厂函数
← 返回 JavaScript Academy