在閱讀 JavaScript 源碼，尤其是壓縮后的代碼時(shí)，很多人常常會(huì)遇到這樣的片段：
if (!0) { }
if (!1) { }
這些詭異的語(yǔ)法你可能一開始會(huì)覺得費(fèi)解，但其實(shí)是壓縮器（比如 UglifyJS、Terser）為了追求 最小體積和最高性能 的結(jié)果。
這一類代碼就是所謂的 JavaScript 壓縮寫法。它們壓縮得極致，同時(shí)也保持了邏輯一致性。下面我們就系統(tǒng)聊聊有哪些經(jīng)典寫法、為啥這么寫、哪些能用哪些要注意。
?? 布爾值壓縮：true/false 最短寫法
| 語(yǔ)義 | 原始寫法 | 壓縮寫法 | 說明 |
|---|
| true | true | !0 | 邏輯真 |
| false | false | !1 | 邏輯假 |
| 強(qiáng)制轉(zhuǎn)布爾值 | Boolean(x) | !!x | 常見強(qiáng)轉(zhuǎn)布爾寫法 |
!!x 是最經(jīng)典的布爾轉(zhuǎn)型寫法，用得非常廣泛，比如：
const isValid = !!user.id
?? undefined 與 null 的壓縮技巧
| 意圖 | 原始寫法 | 壓縮寫法 | 說明 |
|---|
| undefined 值 | undefined | void 0 | 永遠(yuǎn)返回 undefined |
| 判斷 undefined 類型 | typeof x === 'undefined' | typeof x == 'undefined' | 雙等號(hào)足夠安全 |
| 判斷是否為 null | x === null | null == x | 包括 null 和 undefined |
void 0 是一個(gè)冷門但安全的寫法，它繞過了 undefined 可能被覆蓋的問題（老瀏覽器或者手動(dòng)重寫）。
?? 條件邏輯壓縮
| 原始寫法 | 壓縮寫法 | 含義 |
|---|
x ? true : false | !!x | 轉(zhuǎn)換為布爾值 |
x ? x : y | `x |
|
x ? y : null | x && y | x 存在則執(zhí)行 y |
if (x) return true; | return !!x; | 簡(jiǎn)潔返回布爾 |
這些寫法多數(shù)來自于邏輯短路的使用，既壓縮代碼，也提升性能（少一層判斷）。
?? 類型判斷 & 替代操作符
| 原始寫法 | 壓縮寫法 | 說明 |
|---|
typeof foo === 'function' | typeof foo == 'function' | 雙等號(hào)更短 |
Array.isArray(x) | x instanceof Array | 兼容性略差，但更短 |
x !== undefined | void 0 !== x | 避免使用 undefined 字面量 |
壓縮器通常偏好雙等號(hào)，因?yàn)槠渥止?jié)更少。而 typeof 場(chǎng)景下使用雙等號(hào)其實(shí)是安全的（因?yàn)椴粫?huì)觸發(fā)類型轉(zhuǎn)換）。
?? 數(shù)組與對(duì)象壓縮
| 原始寫法 | 壓縮寫法 | 說明 |
|---|
[1, 2, 3].length | 3 | 直接寫字面量節(jié)省字符 |
{a: a} | {a} | ES6 對(duì)象屬性簡(jiǎn)寫 |
obj['key'] | obj.key | 如果 key 合法，更短更直觀 |
這些優(yōu)化大多自動(dòng)由現(xiàn)代壓縮器處理，無需人工介入，但有助于理解源碼。
?? 函數(shù)和箭頭函數(shù)優(yōu)化
| 原始寫法 | 壓縮寫法 | 說明 |
|---|
function () {} | ()=>{} | 箭頭函數(shù)更短 |
function(a){ return a*2 } | a=>2*a | 單表達(dá)式更可簡(jiǎn)寫 |
注意，箭頭函數(shù)沒有 this，不要盲目替換類方法等。
?? 數(shù)學(xué)與位運(yùn)算優(yōu)化
| 原始寫法 | 壓縮寫法 | 說明 |
|---|
Math.floor(x) | ~~x | 雙按位取反等價(jià)于 floor |
Math.pow(x, 2) | x * x | 常數(shù)次方直接展開更快更短 |
parseInt(x, 10) | `+x | 0` |
但這些寫法不要輕易使用在業(yè)務(wù)代碼中，因?yàn)闀?huì)讓代碼可讀性大幅下降。
?? Bonus：冷門但實(shí)用的壓縮技巧
| 原始寫法 | 壓縮寫法 | 說明 |
|---|
for (let i=0; i<n; i++) | for(i=n;i--;) | 倒序遍歷節(jié)省初始化代碼 |
a != null | null != a | 可以避免 null 和 undefined |
x && x.fn() | x?.fn() | 可選鏈更短，但需現(xiàn)代瀏覽器支持 |
? 寫在最后：壓縮寫法是“寫給機(jī)器的代碼”
這些技巧大多來源于壓縮器的優(yōu)化邏輯，是寫給機(jī)器看的代碼。
開發(fā)者日常業(yè)務(wù)中，并不推薦自己手動(dòng)這么寫。更推薦的是：
- 業(yè)務(wù)代碼保持可讀性
- 構(gòu)建階段交給打包工具壓縮
- 理解這些寫法，能更好閱讀源碼、調(diào)試、做逆向
轉(zhuǎn)自https://juejin.cn/post/7512699604632371250
該文章在 2025/6/9 10:14:49 編輯過
400 186 1886
