首頁 > web前端 > js教程 > 主體

避免 JS/TS 中不精確布林計算的陷阱

WBOY
發布: 2024-07-21 12:25:38
原創
700 人瀏覽過

Éviter les pièges des évaluations booléennes imprécises en JS/TS

在 Web 開發領域,我們經常面臨乍看很簡單的挑戰,但很快就會變成複雜的難題。最近,我在 Angular 專案中經歷了一次有趣的經歷,它提醒我在 TypeScript 中評估布林條件時精確度的重要性。我想與您分享這個教訓,希望它能幫助您避免相同的陷阱。

問題的背景

初步情況

在我的 Angular 專案中,我遇到了涉及四個布林變數的情況。在這四個中,兩個依賴通過可觀察的來自後端的非同步資料。目標很簡單:只有當這兩個特定變數為假時,條件才應該為真。

最初的方法及其局限性

最初,我選擇了一種對我來說似乎合乎邏輯且簡潔的方法:

if (terrainPret && arbitreArrive && 
    !equipeLocaleAbsente && !equipeVisiteuseAbsente) {
  // Commencer le match
}
登入後複製

這種方法看起來很優雅:使用感嘆號 (!) 是為了確保非同步變數為 false。然而,我很快就發現這個方法隱藏著一個微妙的陷阱。

布林求值陷阱

啟示錄

當我意識到我的程式碼沒有按預期運行時,問題就出現了。經過調查,我意識到我忽略了 TypeScript 中布爾求值的一個關鍵方面。

技術說明

在 TypeScript 中,有幾個值被認為是“falsy”,也就是說,它們在布林上下文中被評估為 false。這些值包括:

  • 0
  • ""(空字串)
  • 未定義
  • NaN

就我而言,非同步變數在從後端接收值之前可能是未定義的。因此,例如,條件 !equipeLocaleAbsente 不僅在變數為 false 時為 true,而且在變數未定義時也為 true。

解決方案:明確

糾正的方法

為了解決這個問題,我必須更明確地表達我的情況:

if (terrainPret && arbitreArrive && 
    equipeLocaleAbsente === false && equipeVisiteuseAbsente === false) {
  // Commencer le match
}
登入後複製

這種方法確保非同步變數明確為假,而不僅僅是「假」值。

精確度的好處

此解有幾個優點:

  1. 它消除了條件評估中的歧義。
  2. 它使程式碼更具可讀性並且其意圖更明確。
  3. 它可以防止與「假」值評估相關的意外行為。

結論

這段經歷提醒我程式碼中精確性和清晰度的重要性,尤其是在處理非同步操作和布林求值時。它還強調需要了解我們使用的語言的細微差別。

以上是避免 JS/TS 中不精確布林計算的陷阱的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:dev.to
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!