贝利信息

JavaScript剪刀石头布函数深度解析:正则表达式与三元运算符的巧妙应用

日期:2025-12-04 00:00 / 作者:碧海醫心

本文深入解析一个简洁的javascript剪刀石头布(rock-paper-scissors)游戏函数`rps`。我们将重点剖析其如何利用正则表达式(包含or运算符`|`)来匹配获胜组合,并结合三元运算符与字符串模板,以高度精炼的方式判断游戏结果,帮助读者理解javascript的基础特性及其在实际问题中的应用。

JavaScript剪刀石头布游戏函数解析

在JavaScript中,我们可以通过多种方式实现剪刀石头布(Rock-Paper-Scissors)游戏逻辑。以下是一个高度精简的实现示例,它巧妙地结合了箭头函数、三元运算符、字符串模板以及正则表达式来判断游戏结果:

const rps = (a, b) => a == b ? 'Draw!' : `Player ${/rp|ps|sr/.test(a[0]+b[0]) ? 2 : 1} won!`;

这个函数接收两个参数 a 和 b,分别代表两位玩家的出拳("rock"、"paper" 或 "scissors")。它的目标是返回游戏结果,例如 "Draw!"、"Player 1 won!" 或 "Player 2 won!"。接下来,我们将详细拆解这个函数的工作原理。

1. 箭头函数与基本结构

首先,rps = (a, b) => ... 是一个ES6的箭头函数语法。它定义了一个名为 rps 的常量,其值为一个函数,该函数接收 a 和 b 两个参数。

函数体内部是一个顶级的三元运算符: a == b ? 'Draw!' : ...

这部分非常直观:

2. 核心胜负判断逻辑

当游戏不是平局时,函数会执行以下表达式: `Player ${/rp|ps|sr/.test(a[0]+b[0]) ? 2 : 1} won!`

这是一个字符串模板(使用反引号 ` 定义),它允许我们在字符串中嵌入表达式。其中最核心且需要理解的部分是 ${/rp|ps|sr/.test(a[0]+b[0]) ? 2 : 1}。

a. 组合玩家出拳的首字母

a[0]+b[0] 这部分是关键。它从每个玩家的出拳字符串中取出第一个字符并进行拼接。

b. 正则表达式 /rp|ps|sr/

接下来,a[0]+b[0] 的结果被用于与一个正则表达式进行匹配测试:/rp|ps|sr/。

这些组合代表了玩家2获胜的所有情况:

c. .test() 方法

.test() 是正则表达式对象的一个方法,它用于测试一个字符串是否与该正则表达式匹配。

所以,/rp|ps|sr/.test(a[0]+b[0]) 会检查拼接后的两个首字母字符串(例如 "rp")是否是 "rp"、"ps" 或 "sr" 中的一个。

d. 内部三元运算符 ? 2 : 1

.test() 方法的返回值(true 或 false)被用作另一个三元运算符的条件: ... ? 2 : 1

3. 完整的字符串模板

最终,内部三元运算符的结果(1 或 2)被嵌入到字符串模板中,形成最终的游戏结果字符串。

示例代码与运行结果

const rps = (a, b) => a == b ? 'Draw!' : `Player ${/rp|ps|sr/.test(a[0]+b[0]) ? 2 : 1} won!`;

console.log(rps("rock", "rock"));     // Output: Draw!
console.log(rps("rock", "paper"));    // Output: Player 2 won! (a[0]+b[0] = "rp", matches regex)
console.log(rps("paper", "scissors")); // Output: Player 2 won! (a[0]+b[0] = "ps", matches regex)
console.log(rps("scissors", "rock")); // Output: Player 2 won! (a[0]+b[0] = "sr", matches regex)
console.log(rps("paper", "rock"));    // Output: Player 1 won! (a[0]+b[0] = "pr", does not match regex)
console.log(rps("scissors", "paper"));// Output: Player 1 won! (a[0]+b[0] = "sp", does not match regex)
console.log(rps("rock", "scissors")); // Output: Player 1 won! (a[0]+b[0] = "rs", does not match regex)

注意事项与总结