讲座主题：JavaScript 模式匹配提案：实现代数数据类型（ADT）的结构化拆解
各位技术同仁，大家好！
在今天的讲座中，我们将深入探讨 JavaScript 语言一个激动人心的新提案——模式匹配（Pattern Matching）。这个提案，一旦进入语言标准，将彻底改变我们处理复杂数据结构的方式，尤其是在代数数据类型（Algebraic Data Types, ADT）的结构化拆解方面，带来前所未有的清晰度、安全性和表达力。
我们将从理解 ADT 在 JavaScript 中的现状入手，审视现有数据处理机制的局限性，然后逐步引入模式匹配提案的核心概念、语法和能力。最终，我们将通过丰富的代码示例，展示模式匹配如何优雅地解决 ADT 的结构化拆解问题，并探讨它对 JavaScript 生态系统未来的深远影响。
一、引言：数据处理的挑战与模式匹配的承诺
JavaScript 作为一门动态且灵活的语言，在处理数据方面提供了强大的对象和数组字面量、解构赋值等机制。然而，随着应用复杂度的提升，我们经常需要处理更为复杂、具有多种可能形态的数据结构，这在函数式编程领域通常被称为“代数数据类型”（ADT）。
考虑这样一个场景：一个函数可能返回一个成功的结果，也可能返回一个错误；一个用户界面组件可能处于加载中、数据已获取、数据为空或发生错误等多种状态；一个几何图形可以是圆形、矩形或三角形。在这些情况下，我们需要编写代码来判断数据的具体形态，并根据其内部结构来提取所需的信息。
当前在 JavaScript 中，处理这类多态数据结构往往依赖于一系列 if/else if 语句、switch 语句，或者通过检查对象属性、instanceof 操作符等方式。这种处理方式常常导致：
- 冗余和重复：为了区分不同的数据形态，需要编写大量的条件判断代码。
- 易错性：容易遗漏某些情况，或者在提取数据时因为类型不确定而导致运行时错误。
- 可读性差：业务逻辑被淹没在大量的类型检查和条件分支中，代码意图不清晰。
- 缺乏安全性：无法在语言层面强制我们处理所有可能的数据情况，增加了程序崩溃的风险。
模式匹配提案，正是为了解决这些痛点而生。它引入了一种声明式的、富有表现力的方式来检查一个值是否符合特定的模式，并在匹配成功时，同时解构出该值内部的组件。对于 ADT 而言，这意味着我们可以直观地“匹配”其不同的“构造器”或“变体”，并安全地提取它们携带的数据。这不仅提升了代码的可读性和简洁性，更重要的是，它为 JavaScript 带来了处理复杂数据结构的“结构化拆解”能力，显著增强了代码的健壮性。
二、代数数据类型（ADT）在 JavaScript 中的模拟与挑战
在深入模式匹配之前，我们首先需要理解什么是代数数据类型（ADT），以及它们在 JavaScript 中是如何被模拟和处理的。ADT 是函数式编程语言中的一个核心概念，它允许我们通过组合现有类型来创建新的复杂类型。ADT 主要分为两类：
- 乘积类型（Product Types）：类似于结构体或记录，一个值包含多个字段，这些字段共同定义了该值的完整结构。例如，一个点
Point { x: number, y: number }就是一个乘积类型，它同时拥有x和y两个字段。 - 和类型（Sum Types）：一个值可以是多种可能类型中的一种。例如，一个
Option<T>类型的值，它可以是Some<T>（包含一个T类型的值），也可以是None（不包含任何值）。它“或者”是Some，“或者”是None。
JavaScript 本身并没有内置的 ADT 语法，但我们可以通过对象、类、枚举等方式来模拟它们。
2.1 模拟乘积类型
乘积类型在 JavaScript 中非常自然，就是普通的 JavaScript 对象。
示例：User 类型
// 乘积类型：一个 User 对象包含 id, name, email
class User {
constructor(id, name, email) {
this.id = id;
this.name = name;
this.email = email;
}
}
const user = new User(1, "Alice", "[email protected]");
// 现有解构方式：
const { id, name } = user;
console.log(`User ID: ${id}, Name: ${name}`); // User ID: 1, Name: Alice这种情况下，JavaScript 现有的解构赋值已经非常强大和足够。
2.2 模拟和类型（Sum Types）
和类型是模式匹配真正发挥作用的领域。我们将通过几个常见示例来展示它们在 JavaScript 中的模拟以及当前处理的复杂性。
示例 1：Option 或 Maybe 类型
Option<T> 类型用于表示一个值可能存在，也可能不存在。它有两个变体：Some(value) 表示值存在，None 表示值不存在。
当前 JavaScript 模拟方式
通常使用类来模拟：
// Option/Maybe 类型
class Option {
static Some(value) { return new Some(value); }
static None() { return new None(); }
isSome() { return false; }
isNone() { return false; }
}
class Some extends Option {
constructor(value) {
super();
this.value = value;
}
isSome() { return true; }
}
class None extends Option {
isNone() { return true; }
}
// 模拟一个可能返回值的函数
function findUser(id) {
if (id === 1) {
return Option.Some({ id: 1, name: "Alice" });
}
return Option.None();
}
// 当前处理方式：使用 instanceof 或自定义的 isSome/isNone 方法
function greetUser(userId) {
const userOption = findUser(userId);
if (userOption.isSome()) { // 或者 userOption instanceof Some
const user = userOption.value; // 需要手动提取值
console.log(`Hello, ${user.name}!`);
} else { // 或者 userOption instanceof None
console.log("User not found.");
}
}
greetUser(1); // Hello, Alice!
greetUser(2); // User not found.这种方式的挑战：
- 手动检查类型：每次使用时都需要
isSome()或instanceof来判断具体类型。 - 手动提取值：判断为
Some后，需要手动通过userOption.value提取内部值。 - 冗余：对于每个
Option的使用，都需要重复类似的if/else结构。
示例 2：Result 或 Either 类型
Result<T, E> 类型用于表示一个操作的异步结果，它或者是一个成功的值 Ok(value)，或者是一个错误 Err(error)。
当前 JavaScript 模拟方式
// Result/Either 类型
class Result {
static Ok(value) { return new Ok(value); }
static Err(error) { return new Err(error); }
isOk() { return false; }
isErr() { return false; }
}
class Ok extends Result {
constructor(value) {
super();
this.value = value;
}
isOk() { return true; }
}
class Err extends Result {
constructor(error) {
super();
this.error = error;
}
isErr() { return true; }
}
// 模拟一个可能失败的操作
function divide(a, b) {
if (b === 0) {
return Result.Err("Division by zero is not allowed.");
}
return Result.Ok(a / b);
}
// 当前处理方式：
function handleDivision(num1, num2) {
const divisionResult = divide(num1, num2);
if (divisionResult.isOk()) { // 或者 divisionResult instanceof Ok
const result = divisionResult.value;
console.log(`Division successful: ${num1} / ${num2} = ${result}`);
} else { // 或者 divisionResult instanceof Err
const error = divisionResult.error;
console.error(`Division failed: ${error}`);
}
}
handleDivision(10, 2); // Division successful: 10 / 2 = 5
handleDivision(10, 0); // Division failed: Division by zero is not allowed.与 Option 类似，Result 的处理也面临相同的挑战，甚至更为复杂，因为成功和失败分支都需要提取不同的数据。
示例 3：复杂的枚举（带有载荷）
考虑一个表示几何图形的类型，它可以是圆形、矩形或三角形，并且每种图形都带有自己的特定属性。
当前 JavaScript 模拟方式
// 几何图形 ADT
class Shape {
constructor(type) {
this.type = type; // 用于区分类型的属性
}
}
class Circle extends Shape {
constructor(radius) {
super("circle");
this.radius = radius;
}
}
class Rectangle extends Shape {
constructor(width, height) {
super("rectangle");
this.width = width;
this.height = height;
}
}
class Triangle extends Shape {
constructor(base, height) {
super("triangle");
this.base = base;
this.height = height;
}
}
// 创建一些图形实例
const myCircle = new Circle(5);
const myRectangle = new Rectangle(10, 20);
const myTriangle = new Triangle(6, 8);
// 当前处理方式：使用 switch 语句或 instanceof
function getShapeArea(shape) {
if (shape instanceof Circle) {
// console.log("Calculating circle area...");
return Math.PI * shape.radius * shape.radius;
} else if (shape instanceof Rectangle) {
// console.log("Calculating rectangle area...");
return shape.width * shape.height;
} else if (shape instanceof Triangle) {
// console.log("Calculating triangle area...");
return 0.5 * shape.base * shape.height;
} else {
throw new Error("Unknown shape type.");
}
}
// 或者使用 type 属性的 switch 语句
function getShapeAreaWithTypeSwitch(shape) {
switch (shape.type) {
case "circle":
// console.log("Calculating circle area...");
return Math.PI * shape.radius * shape.radius;
case "rectangle":
// console.log("Calculating rectangle area...");
return shape.width * shape.height;
case "triangle":
// console.log("Calculating triangle area...");
return 0.5 * shape.base * shape.height;
default:
throw new Error("Unknown shape type.");
}
}
console.log(`Circle Area: ${getShapeArea(myCircle)}`);
console.log(`Rectangle Area: ${getShapeArea(myRectangle)}`);
console.log(`Triangle Area: ${getShapeArea(myTriangle)}`);这种 if/else if 或 switch 方式的问题：
- 重复的类型检查：在每个分支中，我们都需要再次确认类型，然后才能安全地访问其特有的属性。
- 脆弱性：如果忘记处理某个形状，运行时可能会抛出错误，或者在
switch语句中进入default分支而没有明确的错误提示。 - 不直观：当数据结构变得更复杂，或者需要嵌套解构时，这种方式会变得非常笨拙。
总结来说，尽管 JavaScript 提供了模拟 ADT 的能力，但处理这些模拟 ADT 的结构化拆解时，我们目前缺乏一种简洁、安全且富有表现力的方式。这正是模式匹配提案试图填补的空白。
三、JavaScript 现有解构赋值的局限性
在引入模式匹配之前，我们先快速回顾一下 JavaScript 现有的解构赋值（Destructuring Assignment）能力，并指出其在处理 ADT 时的局限性。
3.1 对象解构
对象解构允许我们从对象中提取属性值，并将其赋给变量。
const user = { firstName: "Jane", lastName: "Doe", age: 30 };
// 基本解构
const { firstName, age } = user;
console.log(firstName, age); // Jane 30
// 重命名
const { firstName: givenName, lastName: familyName } = user;
console.log(givenName, familyName); // Jane Doe
// 默认值
const { city = "Unknown" } = user;
console.log(city); // Unknown
// 嵌套解构
const company = { name: "Tech Corp", address: { street: "Main St", zip: "10001" } };
const { address: { street } } = company;
console.log(street); // Main St
// 剩余属性
const { firstName: fName, ...rest } = user;
console.log(fName, rest); // Jane { lastName: "Doe", age: 30 }对象解构对于乘积类型的数据（即普通对象）非常有效。
3.2 数组解构
数组解构允许我们从数组中提取元素，并将其赋给变量。
const colors = ["red", "green", "blue"];
// 基本解构
const [firstColor, secondColor] = colors;
console.log(firstColor, secondColor); // red green
// 跳过元素
const [, , thirdColor] = colors;
console.log(thirdColor); // blue
// 默认值
const [c1, c2, c3, c4 = "purple"] = colors;
console.log(c4); // purple
// 剩余元素
const [primary, ...secondary] = colors;
console.log(primary, secondary); // red ["green", "blue"]
// 嵌套解构
const matrix = [[1, 2], [3, 4]];
const [[r1c1, r1c2], [r2c1, r2c2]] = matrix;
console.log(r1c1, r2c2); // 1 4数组解构对于列表或元组等结构非常有用。
3.3 现有解构的局限性
尽管现有解构非常强大，但它在处理 ADT，尤其是和类型时，存在显著的局限性：
- 无法进行基于类型的匹配：解构赋值只能基于属性名或数组索引进行匹配和提取，无法根据一个值的“类型”（如
instanceof或一个特定构造函数）来决定如何解构。例如，我们不能说“如果这个对象是Circle实例，就解构它的radius属性”。 - 缺乏条件匹配：无法在解构的同时添加额外的条件（Guard Clauses），例如“如果
radius大于 10，才进行此解构”。 - 无法处理多态性：对于和类型（Sum Types），现有解构无法表达“这个值可以是
A结构，也可以是B结构，根据它是哪一种来执行不同的解构和逻辑”。我们必须先用if/else或switch判断类型，然后再在各自的分支内进行解构。 - 非穷尽性检查：语言层面无法提醒我们是否已经覆盖了所有可能的结构。
这些局限性正是模式匹配提案旨在解决的核心问题。它将解构的能力提升到一个新的层次，使其能够理解和响应更复杂的数据结构和类型变体。
四、JavaScript 模式匹配提案概览
JavaScript 的模式匹配提案（目前处于 Stage 2 阶段，由 Ron Buckton 领导）引入了一个新的 match 表达式，它允许我们对一个值进行一系列模式的匹配，并在第一个成功匹配的模式下执行相应的代码块。这与许多其他语言（如 Rust, Scala, Haskell, Elixir）中的模式匹配概念类似。
4.1 match 表达式的基本语法
match 表达式的语法结构如下：
const result = match (value) {
when pattern1 => expression1,
when pattern2 if condition2 => expression2,
when pattern3 => expression3,
// ...
when _ => defaultExpression, // 通配符模式作为默认
};match (value): 指定要匹配的目标值。when pattern => expression: 这是一个匹配子句。pattern: 定义了要匹配的结构。如果value符合pattern，则执行此子句。=> expression: 如果模式匹配成功，将执行这个表达式，并将其结果作为match表达式的返回值。
if condition(可选的卫语句): 在模式匹配成功后，condition会被评估。只有当condition也为true时，该子句才算最终匹配成功。_(通配符):_是一个特殊的模式，它匹配任何值。通常用作最后一个when子句，以处理所有未被前面模式匹配到的情况，类似于switch语句中的default。
match 表达式是表达式，这意味着它会返回一个值，这使得它非常适合函数式编程风格，可以用于赋值、作为函数参数或链式调用。
4.2 核心模式类型
模式匹配提案支持多种模式类型，它们可以组合使用以构建复杂的匹配逻辑。
4.2.1 字面量模式 (Literal Patterns)
匹配特定的原始值（字符串、数字、布尔值、null, undefined）。
const status = "success";
const message = match (status) {
when "success" => "Operation completed successfully.",
when "error" => "An error occurred.",
when "pending" => "Operation is still pending.",
when _ => "Unknown status.",
};
console.log(message); // Operation completed successfully.4.2.2 标识符模式 (Identifier Patterns)
将匹配到的值绑定到一个新的变量名。
const value = 42;
const description = match (value) {
when 1 => "The number one.",
when x => `Found a number: ${x}.`, // x 绑定了 value
};
console.log(description); // Found a number: 42.
// 注意：标识符模式会捕获所有不被其他更具体的模式匹配的值。
// 因此，它通常作为较后的备用模式。4.2.3 通配符模式 (_ Pattern)
匹配任何值，但不绑定任何变量。通常用于忽略不关心的值，或作为默认情况。
const day = "Sunday";
const activity = match (day) {
when "Saturday" => "Go hiking!",
when "Sunday" => "Relax at home.",
when _ => "Work day.", // 匹配除周六和周日之外的所有情况
};
console.log(activity); // Relax at home.4.2.4 对象模式 (Object Patterns)
匹配对象的属性。可以嵌套、重命名、提供默认值、使用剩余属性。与现有对象解构非常相似，但用在 when 子句中。
const user = { name: "Bob", age: 25, city: "New York" };
const greeting = match (user) {
when { name: "Alice", age: 30 } => "Hello, specific Alice!", // 精确匹配 name 和 age
when { name: userName, age: userAge } => `Hello, ${userName}! You are ${userAge} years old.`,
when { name: "Bob", city: "New York" } => "Hello, Bob from New York!", // 匹配部分属性
when { name: n, ...rest } if rest.age > 18 => `Hello ${n}, an adult with other details.`, // 带卫语句
when _ => "Unknown user.",
};
console.log(greeting); // Hello, Bob from New York! (因为第一个匹配成功)
const anotherUser = { name: "Charlie", age: 16 };
const anotherGreeting = match (anotherUser) {
when { name: n, ...rest } if rest.age > 18 => `Hello ${n}, an adult with other details.`,
when { name: n } => `Hello ${n}, a minor.`,
when _ => "Unknown user.",
};
console.log(anotherGreeting); // Hello Charlie, a minor. (因为卫语句不通过，匹配下一个)4.2.5 数组模式 (Array Patterns)
匹配数组的元素。可以嵌套、跳过元素、使用剩余元素。
const point = [10, 20];
const line = [[0, 0], [10, 10]];
const description = match (point) {
when [0, 0] => "Origin point.",
when [x, y] if x === y => `Point on diagonal: (${x}, ${y}).`,
when [x, y] => `General point: (${x}, ${y}).`,
when _ => "Not a point.",
};
console.log(description); // General point: (10, 20).
const lineDescription = match (line) {
when [[0, 0], [x2, y2]] => `Line from origin to (${x2}, ${y2}).`,
when [[x1, y1], [x2, y2]] => `Line from (${x1}, ${y1}) to (${x2}, ${y2}).`,
};
console.log(lineDescription); // Line from origin to (10, 10).4.2.6 类/构造函数模式 (Class/Constructor Patterns)
这是模式匹配在 ADT 结构化拆解中最为强大的特性之一。它允许我们匹配一个值是否是某个类的实例，并同时解构该实例的属性。
class Point {
constructor(x, y) {
this.x = x;
this.y = y;
}
}
class Circle {
constructor(center, radius) {
this.center = center;
this.radius = radius;
}
}
const p = new Point(10, 20);
const c = new Circle(new Point(0, 0), 5);
const whatIsIt = match (p) {
when Point { x: 0, y: 0 } => "This is the origin point.",
when Point { x, y } => `This is a Point at (${x}, ${y}).`, // 匹配 Point 实例并解构 x, y
when Circle { center: Point { x, y }, radius } => `This is a Circle centered at (${x}, ${y}) with radius ${radius}.`,
when _ => "Something else.",
};
console.log(whatIsIt); // This is a Point at (10, 20).
const whatIsIt2 = match (c) {
when Point { x, y } => `This is a Point at (${x}, ${y}).`,
when Circle { center: Point { x, y }, radius: r } if r > 10 => `Large Circle at (${x}, ${y}) with radius ${r}.`,
when Circle { center: Point { x, y }, radius: r } => `Small Circle at (${x}, ${y}) with radius ${r}.`, // 匹配 Circle 实例并解构 center, radius
when _ => "Something else.",
};
console.log(whatIsIt2); // Small Circle at (0, 0) with radius 5.这里 Circle { center: Point { x, y }, radius: r } 展示了嵌套的类模式和对象解构，以及属性重命名 radius: r。
4.2.7 as 模式 (Binding Pattern)
as 模式允许在匹配一个模式的同时，将整个匹配到的值绑定到一个新的变量名。
const data = { type: "user", payload: { id: 1, name: "Alice" } };
const processedData = match (data) {
when { type: "user", payload: userPayload as { id, name } } =>
`User data: ID=${userPayload.id}, Name=${userPayload.name} (full payload: ${JSON.stringify(userPayload)})`,
when { type: "product", payload: productPayload as { productId, price } } =>
`Product data: ID=${productId}, Price=${price} (full payload: ${JSON.stringify(productPayload)})`,
when _ as unknownData => `Unknown data type: ${JSON.stringify(unknownData)}`,
};
console.log(processedData);
// User data: ID=1, Name=Alice (full payload: {"id":1,"name":"Alice"})在这个例子中，userPayload as { id, name } 意味着它不仅会解构 payload 属性为 id 和 name，还会将整个 payload 对象绑定到 userPayload 变量。
4.2.8 卫语句 (Guard Clauses with if)
卫语句允许我们在模式匹配成功后，添加额外的任意条件来进一步筛选匹配。
const temperature = 25;
const weatherAdvice = match (temperature) {
when t if t < 0 => "It's freezing!",
when t if t >= 0 && t < 10 => "It's cold.",
when t if t >= 10 && t < 20 => "It's cool.",
when t if t >= 20 && t < 30 => "It's warm.",
when t => "It's hot!", // t 绑定了 temperature，作为最后的通用匹配
};
console.log(weatherAdvice); // It's warm.4.3 匹配的优先级和穷尽性
- 从上到下匹配：
match表达式会按when子句的顺序从上到下进行匹配。一旦找到第一个匹配成功的子句，就会执行其对应的表达式，并停止进一步的匹配。 - 模式的具体性：更具体的模式应该放在前面，更通用的模式（如标识符模式或通配符模式）应该放在后面，以避免它们提前捕获了更具体的匹配。
- 穷尽性：JavaScript 运行时本身不会强制要求
match表达式覆盖所有可能的输入情况（不像一些静态类型语言）。但强烈建议在match表达式的末尾添加一个通配符 (_) 模式作为默认处理，以确保所有输入都能被处理，避免运行时错误。
有了这些基础，我们现在可以深入探讨模式匹配如何优雅地解决 ADT 的结构化拆解问题。
五、模式匹配实现 ADT 的结构化拆解
现在，我们将利用模式匹配提案的强大功能，重新审视之前模拟的 ADT 示例，展示它如何带来更清晰、更安全、更简洁的数据处理方式。
5.1 重新审视 Option 类型
Option 类型代表一个值可能存在或不存在。
旧方式（使用 if/else 和 instanceof）
// ... (Option, Some, None 类的定义同前) ...
function greetUserOld(userId) {
const userOption = findUser(userId); // findUser 返回 Option.Some 或 Option.None
if (userOption instanceof Some) {
const user = userOption.value;
console.log(`Hello (old way), ${user.name}!`);
} else if (userOption instanceof None) {
console.log("User not found (old way).");
} else {
// 理论上不会发生，但为了健壮性可能需要
console.log("Invalid Option type (old way).");
}
}新方式（使用模式匹配）
// Option/Maybe 类型
class Option {
static Some(value) { return new Some(value); }
static None() { return new None(); }
}
class Some extends Option {
constructor(value) {
super();
this.value = value;
}
}
class None extends Option {}
// 模拟一个可能返回值的函数
function findUser(id) {
if (id === 1) {
return Option.Some({ id: 1, name: "Alice" });
}
return Option.None();
}
function greetUserNew(userId) {
const userOption = findUser(userId);
const message = match (userOption) {
when Some { value: { name } } => `Hello (new way), ${name}!`, // 匹配 Some 实例并解构其 value 中的 name
when None => "User not found (new way).", // 匹配 None 实例
when _ => "Unexpected Option type.", // 确保所有情况都被覆盖
};
console.log(message);
}
greetUserNew(1); // Hello (new way), Alice!
greetUserNew(2); // User not found (new way).对比分析
| 特性 | 旧方式 (if/else + instanceof) |
新方式 (match 表达式) |
|---|---|---|
| 可读性 | 逻辑分散，需要多次 instanceof 判断和手动值提取。 |
声明式，清晰地列出每种情况及其处理方式，一步完成匹配和解构。 |
| 简洁性 | 多个 if/else if 语句，可能导致嵌套和冗余。 |
单一 match 表达式，减少了样板代码。 |
| 安全性 | 容易遗漏分支，或者在非 Some 分支中尝试访问 value 导致运行时错误。 |
匹配成功后，值已被安全解构，避免了错误访问。鼓励穷尽性处理。 |
| 表达力 | 侧重于“如何”检查类型和提取数据。 | 侧重于“什么”类型的结构以及“如何”处理它，更接近业务逻辑的自然表达。 |
| 扩展性 | 增加新的 ADT 变体时，需要修改所有使用该 ADT 的 if/else 链。 |
增加新的 when 子句即可，结构清晰，修改影响范围明确。 |
5.2 重新审视 Result 类型
Result 类型表示一个操作的成功或失败。
旧方式（使用 if/else 和 instanceof）
// ... (Result, Ok, Err 类的定义同前) ...
function handleDivisionOld(num1, num2) {
const divisionResult = divide(num1, num2); // divide 返回 Result.Ok 或 Result.Err
if (divisionResult instanceof Ok) {
const result = divisionResult.value;
console.log(`Division successful (old way): ${num1} / ${num2} = ${result}`);
} else if (divisionResult instanceof Err) {
const error = divisionResult.error;
console.error(`Division failed (old way): ${error}`);
} else {
console.error("Invalid Result type (old way).");
}
}新方式（使用模式匹配）
// Result/Either 类型
class Result {
static Ok(value) { return new Ok(value); }
static Err(error) { return new Err(error); }
}
class Ok extends Result {
constructor(value) {
super();
this.value = value;
}
}
class Err extends Result {
constructor(error) {
super();
this.error = error;
}
}
// 模拟一个可能失败的操作
function divide(a, b) {
if (b === 0) {
return Result.Err("Division by zero is not allowed.");
}
return Result.Ok(a / b);
}
function handleDivisionNew(num1, num2) {
const divisionResult = divide(num1, num2);
const message = match (divisionResult) {
when Ok { value: res } => `Division successful (new way): ${num1} / ${num2} = ${res}`,
when Err { error: errMessage } => `Division failed (new way): ${errMessage}`,
when _ => "Unexpected Result type.",
};
console.log(message); // 注意：这里使用 console.log 统一输出，实际错误处理应使用 console.error
}
handleDivisionNew(10, 2); // Division successful (new way): 10 / 2 = 5
handleDivisionNew(10, 0); // Division failed (new way): Division by zero is not allowed.对比分析
Result 类型的模式匹配同样体现了简洁性和安全性。它明确区分了成功和失败两种情况，并允许我们直接解构出 value 或 error，而无需额外的中间变量或类型断言。
5.3 重新审视复杂的枚举（Shape 类型）
Shape 类型包含 Circle, Rectangle, Triangle 等变体，每种变体有不同的属性。
旧方式（使用 if/else if 或 switch on type property）
// ... (Shape, Circle, Rectangle, Triangle 类的定义同前) ...
function getShapeAreaOld(shape) {
if (shape instanceof Circle) {
return Math.PI * shape.radius * shape.radius;
} else if (shape instanceof Rectangle) {
return shape.width * shape.height;
} else if (shape instanceof Triangle) {
return 0.5 * shape.base * shape.height;
} else {
throw new Error("Unknown shape type (old way).");
}
}新方式（使用模式匹配）
// 几何图形 ADT
class Shape {
constructor(type) {
this.type = type; // 实际上，有了模式匹配，这个 type 属性变得不那么必要了
}
}
class Circle extends Shape {
constructor(radius) {
super("circle");
this.radius = radius;
}
}
class Rectangle extends Shape {
constructor(width, height) {
super("rectangle");
this.width = width;
this.height = height;
}
}
class Triangle extends Shape {
constructor(base, height) {
super("triangle");
this.base = base;
this.height = height;
}
}
// 创建一些图形实例
const myCircle = new Circle(5);
const myRectangle = new Rectangle(10, 20);
const myTriangle = new Triangle(6, 8);
const largeCircle = new Circle(12);
function getShapeAreaNew(shape) {
return match (shape) {
when Circle { radius } => Math.PI * radius * radius,
when Rectangle { width, height } => width * height,
when Triangle { base, height } => 0.5 * base * height,
when _ => throw new Error("Unknown shape type (new way)."),
};
}
console.log(`Circle Area (new): ${getShapeAreaNew(myCircle)}`);
console.log(`Rectangle Area (new): ${getShapeAreaNew(myRectangle)}`);
console.log(`Triangle Area (new): ${getShapeAreaNew(myTriangle)}`);
// 结合卫语句和更复杂的匹配
function describeShape(shape) {
return match (shape) {
when Circle { radius: r } if r > 10 => `This is a large circle with radius ${r}.`,
when Circle { radius: r } => `This is a small circle with radius ${r}.`,
when Rectangle { width, height } if width === height => `This is a square with side ${width}.`,
when Rectangle { width, height } => `This is a rectangle of ${width}x${height}.`,
when Triangle { base, height } => `This is a triangle with base ${base} and height ${height}.`,
when _ => "This is an unknown shape.",
};
}
console.log(describeShape(myCircle)); // This is a small circle with radius 5.
console.log(describeShape(largeCircle)); // This is a large circle with radius 12.
console.log(describeShape(new Rectangle(5, 5))); // This is a square with side 5.
console.log(describeShape(myRectangle)); // This is a rectangle of 10x20.对比分析
模式匹配在处理像 Shape 这样具有多个变体且每个变体携带不同数据的 ADT 时，其优势尤为明显：
- 直观的结构拆解：直接在
when子句中声明要匹配的类和要解构的属性，一目了然。 - 消除了
type属性的依赖：我们不再需要为每个 ADT 变体添加一个冗余的type字符串属性来区分它们，因为模式匹配直接通过构造函数来识别。 - 卫语句的强大：能够轻松地添加基于属性值的额外条件，使逻辑更加精细和表达性强。
- 提升了代码的“正确性”：鼓励开发者考虑所有可能的输入情况，通过
_模式处理未预料到的情况，使得代码更健壮。
5.4 递归 ADT 的结构化拆解：链表示例
模式匹配对于处理递归数据结构（如链表、树）同样强大。让我们以一个简单的单向链表为例。
链表 ADT 模拟
一个链表可以是：
Nil：空列表。Cons(head, tail)：一个非空列表，包含一个头部元素head和一个尾部列表tail。
class List {
static Nil() { return new Nil(); }
static Cons(head, tail) { return new Cons(head, tail); }
}
class Nil extends List {}
class Cons extends List {
constructor(head, tail) {
super();
this.head = head;
this.tail = tail;
}
}
// 创建一个链表：1 -> 2 -> 3 -> Nil
const myList = List.Cons(1, List.Cons(2, List.Cons(3, List.Nil())));
const emptyList = List.Nil();使用模式匹配处理链表
function sumList(list) {
return match (list) {
when Nil => 0, // 空列表和为0
when Cons { head, tail } => head + sumList(tail), // 非空列表，累加头部并递归处理尾部
when _ => throw new Error("Invalid list structure."),
};
}
console.log(`Sum of myList: ${sumList(myList)}`); // 6
console.log(`Sum of emptyList: ${sumList(emptyList)}`); // 0
function printList(list) {
const elements = [];
let currentList = list;
while (true) {
const action = match (currentList) {
when Nil => {
elements.push("Nil");
return "break";
},
when Cons { head, tail } => {
elements.push(head);
currentList = tail;
return "continue";
},
when _ => {
throw new Error("Malformed list!");
}
};
if (action === "break") break;
}
return elements.join(" -> ");
}
console.log(`myList: ${printList(myList)}`); // 1 -> 2 -> 3 -> Nil
console.log(`emptyList: ${printList(emptyList)}`); // Nil这里 sumList 函数展示了模式匹配在递归函数中的简洁性。它直接声明了两种情况：空列表返回 0，非空列表则解构头部和尾部，并递归调用自身。这比传统的 if (list instanceof Nil) 或 if (list.isNil()) 更加直观和紧凑。
printList 示例则展示了如何在迭代中使用 match 表达式来指导循环逻辑。虽然这是一个 while 循环，但 match 表达式清晰地定义了每次迭代中不同列表状态的处理方式。
六、模式匹配为 JavaScript 带来的核心价值
通过上述示例，我们可以清晰地看到模式匹配提案为 JavaScript 带来的诸多核心价值：
- 极大的可读性提升：代码变得更具声明性，读者可以一目了然地看到一个值可能有哪些形态，以及每种形态如何被处理。这比嵌套的
if/else if或switch语句更易于理解和维护。 - 增强的安全性与健壮性：
- 结构化校验：模式匹配在运行时对数据的结构和类型进行校验。只有当数据完全符合模式时，才会执行相应的代码块。
- 安全解构：在匹配成功后，所需的数据（如 ADT 内部的值）会被自动安全地解构到局部变量中，避免了手动访问可能不存在的属性而导致的
undefined错误。 - 鼓励穷尽性：虽然 JavaScript 语言本身没有静态类型系统的穷尽性检查，但模式匹配的结构（尤其是配合通配符
_）鼓励开发者考虑所有可能的输入情况，从而编写出更健壮、不易崩溃的代码。
- 简洁的代码表达：减少了大量的样板代码，如重复的类型检查、条件判断和手动属性访问。特别是对于和类型（Sum Types），它将类型判断和数据提取融为一体。
- 提升表达力：卫语句的引入使得我们可以为模式添加任意的运行时条件，从而实现更精细、更复杂的匹配逻辑，而无需在
when子句内部再编写复杂的if语句。 - 更好的重构能力：当 ADT 结构发生变化时，模式匹配的修改通常局限于受影响的
when子句，影响范围清晰。 - 拥抱函数式编程范式：模式匹配是函数式编程语言中的一个基石。它的引入使得 JavaScript 能够更好地支持不可变数据结构和数据转换，进一步推动 JavaScript 向更现代、更强大的编程范式演进。
- 与现有解构的完美结合：模式匹配并非完全取代现有解构，而是将其能力提升和扩展，使得我们可以在更复杂的上下文中使用解构。
七、挑战与考虑
尽管模式匹配带来了巨大的好处，但在其采纳和使用过程中，我们仍需考虑一些挑战：
- 学习曲线：对于习惯了传统
if/else和switch语句的 JavaScript 开发者来说，模式匹配引入了全新的语法和思维模式，需要一定的学习和适应过程。 - 运行时开销：模式匹配在运行时需要进行结构匹配和条件评估。虽然现代 JavaScript 引擎通常会进行高度优化，但对于极端性能敏感的场景，其潜在的运行时开销仍需关注。
- 调试复杂性：复杂的嵌套模式和卫语句可能会使得调试变得稍微复杂，需要良好的工具支持。
- 与 TypeScript 的集成：模式匹配与 TypeScript 的类型推断和类型守卫（Type Guard）机制有着天然的协同潜力。TypeScript 社区可能会开发出工具，在编译时对模式匹配的穷尽性进行静态检查，进一步提升安全性。
- 提案的演进：模式匹配提案仍在 Stage 2 阶段，这意味着其语法和具体功能仍有可能发生变化。开发者在早期采用时需要关注提案的最新进展。
八、与其他语言模式匹配的比较
模式匹配并非 JavaScript 独创。它在许多其他编程语言中早已是核心特性，尤其是在函数式编程语言中。
| 语言 | 模式匹配特性 | 与 JavaScript 提案的异同 |
|---|---|---|
| Haskell | 强大的模式匹配，包括字面量、变量绑定、构造器模式（针对 ADT）、记录模式、列表模式、as 模式、卫语句等。支持函数参数的模式匹配，并且编译器会进行严格的穷尽性检查。 |