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