JS語法也可以有C#的switch表達(dá)式
正文
于 C/Java 語系的語言,都有 switch 語法。switch 語法用于多分支是一個標(biāo)準(zhǔn)的用法,但這個分支語法的各分支之間存在穿透性,所以需要 break 來切斷邏輯,這也成為 switch 語法中最重要的一個替在缺陷來源。此外,由于 switch 語句中各 case 的代碼是在同一個作用域中,也會對代碼造成一些不便。
C# 8.0 引入了 switch 表達(dá)式。C# 的 switch 表達(dá)式有著非常豐富的語法元素,可以和模式匹配和解構(gòu)等語法元素協(xié)同工作 —— 這些都不在這里細(xì)說,但是對傳統(tǒng)的 switch 語句 進(jìn)行了一些改進(jìn):
- 通過箭頭 (
=>) 標(biāo)記處理了 case 和語句之間的一對一關(guān)系,不需要 break,不再穿透; - 作為表達(dá)式,可以而且必須返回值;
新的約束
- switch 表達(dá)式一定要詳盡(邏輯一定會走進(jìn)某一個 case,可以通過棄元模式兜底),否則可能會在運(yùn)行時引發(fā)異常。
在 C# 8.0 發(fā)布的同年,Java 12 也發(fā)布并引入了 switch 表達(dá)式預(yù)覽。Java 的 switch 表達(dá)式實現(xiàn)比較簡單,就是 switch 語句到 switch 表達(dá)式的直接轉(zhuǎn)換,僅支持等值匹配。直到 2023 年 3 月 Java 20 發(fā)布,switch 表達(dá)式才開始支持模式匹配。相比之下,Kotlin 的 when 表達(dá)式走在了前面。
在這個問題上 JavaScript 似乎走在了后面,不過在語言提供 switch 表達(dá)式之前,我們可以嘗試自己造個輪子。
思路當(dāng)然是參考策略模式。假設(shè)有一個列表,這個列表里的每個元素都包含了兩個因素:第一個用于判斷是否命中,第二個是個函數(shù),得到一個計算結(jié)果。然后寫一個循環(huán)遍歷列表的每個元素,一旦某個元素命中,就執(zhí)行元素攜帶的函數(shù)獲得結(jié)果,中斷循環(huán),返回結(jié)果。如果列表的最后一個元素必定命中,那么這個列表就是“詳盡”的。
when 函數(shù)寫法
那么這個 when 函數(shù)可能會這樣寫(switch 是關(guān)鍵字,所以使用 when 來作為函數(shù)名):
// JS
function when(value, ...cases) {
for (const { is, run } of cases) {
if (is(value)) {
return run(value);
}
}
throw new Error("非詳盡");
}這里我們假設(shè)每個情況 (case) 都含有 is 方法用于判斷是否命中,用 run 方法保存命中后需要執(zhí)行的操作。
分算等級”測試
相應(yīng)地,我們可以經(jīng)典的“拿分算等級”來進(jìn)行測試:
// JS
function calcGrade(score) {
return when(
score,
{ is: v => v >= 0 && v < 80, run: v => `不合格 (${v})` },
{ is: v => v >= 80 && v < 100, run: v => `合格 (${v})` },
{ is: v => v == 100, run: v => `滿分 (${v})` },
{ is: _ => true, run: v => `無效 (${v})` },
);
}
for (let i = 0; i < 50; i++) {
const v = 70 + ~~(Math.random() * 35);
console.log(calcGrade(v));
}在 calcGrade 實現(xiàn)中 when 的 case 列表最后一項采用了“永真”斷言,所以走到這一項的時候一定會命中,從邏輯上來永遠(yuǎn)不會觸發(fā) Error。如果是非“詳盡”的情況列表,就有可能觸發(fā) Error。
測試問題
不過現(xiàn)在從測試代碼中就發(fā)現(xiàn)了兩個問題:
is斷言是采用函數(shù)的形式,不能簡單地直接按值匹配;- 從調(diào)用形式上來說,
score和后面的 case 元素是同級的,形式上區(qū)分不明顯; - 每次都要寫
is和run,條件多了寫起來也煩。
繼續(xù)改進(jìn) ——
// JS
function when(value) {
// when 的參數(shù)先給 switch 的值
// 返回一個函數(shù)來處理分支匹配 ②
return function (...cases) {
for (const [is, run] of cases) {
// ^^^^^^^^^ 從對象改為元組(數(shù)組)③
if (value === is || (typeof is == "function" && is(value))) {
// ^^^^^^ 精確判斷 ①
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 斷言函數(shù)判斷
return run(value);
// ^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^ 可指定行為(函數(shù))
}
}
throw new Error("非詳盡");
};
}
function calcGrade(score) {
return when(score)(
// ^^^^^^^^^^^ 這里返回的是匹配處理的函數(shù)
[v => v >= 0 && v < 80, v => `不合格 (${v})`],
[v => v >= 80 && v < 100, v => `合格 (${v})`],
[100, () => "滿分 (100)"],
// ^^^ 可以指定匹配的值
// ^^ 計算不需要參數(shù),可以不聲明
[_ => true, v => `無效 (${v})`],
// ^^^^^^^^^ 兜底的永真斷言
);
}為什么兜底斷言必須使用一個函數(shù)呢?因為 true 值也有可能是對應(yīng)一種預(yù)想的分支情況。由于這個 when 是通過語義來實現(xiàn)而不是通過語法來實現(xiàn)的,所以這里沒辦法定義一個安全的兜底斷言語法,只有用斷言函數(shù)會相對安全。
升級成 TypeScript
至此為止我們已經(jīng)基本實現(xiàn)了 switch 表達(dá)式 (when),把它升級成 TypeScript
// TypeScript
type CaseCondition<T> = T extends Function ? never : ((t: T) => boolean) | T
type Case<T, R> = [CaseCondition<T>, (t: T) => R];
function when<T>(value: T): <R>(...cases: Case<T, R>[]) => R {
return function<R>(...cases: Case<T, R>[]): R {
for (const [is, run] of cases) {
if (value === is || (typeof is == "function" && is(value))) {
return run(value);
}
}
throw new Error("非詳盡");
};
}
function calcGrade(score: number) {
return when(score)(
[v => v >= 0 && v < 80, v => `不合格 (${v})`],
[v => v >= 80 && v < 100, v => `合格 (${v})`],
[100, () => "滿分 (100)"],
[_ => true, v => `無效 (${v})`],
);
}這段代碼當(dāng)然可以直接用,但是如果使用 npm 可能會更方便一點(diǎn):
npm install @jamesfancy/when
// TypeScript
import { when } from "@jamesfancy/when";
function calcGrade(score: number) {
return when(score)(
[v => v >= 0 && v < 80, v => `不合格 (${v})`],
[v => v >= 80 && v < 100, v => `合格 (${v})`],
[100, () => "滿分 (100)"],
[_ => true, v => `無效 (${v})`],
);
}以上就是JS語法也可以有C# 的switch表達(dá)式的詳細(xì)內(nèi)容,更多關(guān)于JS語法C# switch表達(dá)式的資料請關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
父節(jié)點(diǎn)獲取子節(jié)點(diǎn)的字符串示例代碼
這篇文章主要介紹了父節(jié)點(diǎn)獲取子節(jié)點(diǎn)的字符串的方法,需要的朋友可以參考下2014-02-02
JS如何實現(xiàn)網(wǎng)站中PC端和手機(jī)端自動識別并跳轉(zhuǎn)對應(yīng)的代碼
這篇文章主要介紹了JS如何實現(xiàn)網(wǎng)站中PC端和手機(jī)端自動識別并跳轉(zhuǎn)對應(yīng)的代碼,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2020-01-01
用javascript實現(xiàn)的電信鐵通(網(wǎng)通)自動跳轉(zhuǎn)源代碼
用javascript實現(xiàn)的電信鐵通(網(wǎng)通)自動跳轉(zhuǎn)源代碼...2007-11-11
關(guān)于var在for循環(huán)遇到的問題解決
這篇文章主要給大家介紹了關(guān)于var在for循環(huán)遇到的問題的幾種解決方法,文中通過示例代碼介紹的非常詳細(xì),需要的朋友可以參考下2021-07-07
第二次聊一聊JS require.js模塊化工具的基礎(chǔ)知識
第二次聊一聊JS require.js模塊化工具的基礎(chǔ)知識,本文為大家JS require.js模塊化工具的最基本知識點(diǎn),感興趣的小伙伴們可以參考一下2016-04-04
js之input[type=file]選擇重復(fù)的文件,無法觸發(fā)change事件問題
這篇文章主要介紹了js之input[type=file]選擇重復(fù)的文件,無法觸發(fā)change事件問題,具有很好的參考價值,希望對大家有所幫助。如有錯誤或未考慮完全的地方,望不吝賜教2023-05-05

