JavaScript >> Javascript 文檔 >  >> JavaScript

如何在 JavaScript 中使用三元運算符,並附上示例

這篇簡短的文章將解釋 三元運算符 在JavaScript中以及如何使用它。

三元運算符 是一個簡寫的 if 用於根據條件是否滿足快速執行代碼的語句。

它簡化了您的代碼並減少了視覺混亂。

以下是它的使用方法。

JavaScript 三元運算符語法

三元運算符的使用語法如下:

CONDITION ? TRUE_EXPRESSION : FALSE_EXPRESSION

注意:

  • CONDITION 應該是一個可以被評估為 truthy 的值或表達式 或不真實
  • TRUE_EXPRESSION 是 CONDITION 為真時將執行的表達式
  • FALSE_EXPRESSION 是 CONDITION 不真實時將執行的表達式
  • 字符將條件與表達式分開,而 : 字符分隔真/假表達式
  • 整個表達式將返回計算結果TRUE_EXPRESSIONFALSE_EXPRESSION
    • 這可以分配給變量,允許您有條件地為變量分配值

三元運算符示例

考慮一下這個如果 聲明:

var myNumber = 4;
var myText = "";
if(myNumber > 3) {
    myText = "myNumber is greater than 3";
} else {
    myText = "myNumber is less than 3";
}

它設置 myText 的值 基於 myNumber 值的變量 .對於一個相對簡單的任務,它有很多代碼。

又是這樣,但這次使用了三元運算符 而不是 if 聲明:

var myNumber = 4;
var myText = myNumber > 3 ? "myNumber is greater than 3" : "myNumber is less than 3";

您可以看到 CONDITION (myNumber> 3 ), TRUE_EXPRESSION (“我的號碼大於 3” ) 和 FALSE_EXPRESSION (“myNumber 小於 3” ) 形成三元表達式——其結果分配給變量 myText .

代碼量大大減少,myText 接收三元運算的結果作為它的值。

您可以在此處查看 Mozilla 開發者文檔中的更多示例。

三元運算符使代碼更具可讀性——如果你有很多簡單的 if 語句,它們真的可以清理你的代碼。 如果您按編寫的代碼行數計費,請不要使用它們。


Tutorial JavaScript 教程
  1. 代碼拆分:這會提高 React 應用程序的性能嗎?

  2. toFixed() 和 toPrecision() 的區別?

  3. 需要節點——第 34 卷

  4. HTML 中的 Vue 綁定和 CSS 不起作用

  5. 超越基礎(第五部分):Formik、D3 等!

  6. JavaScript 刪除操作符🎒

  7. 如何通過單擊輸入標籤周圍的 + 和 - 按鈕來增加和減少跨度標籤中的添加?

  1. 如何在 _.chain 中轉換 Lodash groupBy 的結果

  2. 第 3 步:創建模式

  3. Imba 簡介:用於閃電般快速 DOM 更新的 JavaScript 兼容語言

  4. 在開始編碼之前!

  5. 巨魔狩獵 101:JavaScript 通過引用傳遞對象

  6. 關於 JavaScript 的 split() 函數的困惑

  7. 我如何在一個大項目中保持高效

  1. React 和 Mlyn 中的貨幣轉換器應用程序

  2. 使用 AWS Amplify 部署無服務器 NUXT 應用程序

  3. 使用 React 和 Puppeteer 生成 PDF

  4. Gatsby 增量構建指南