JavaScript 三項条件演算子

Harshit Jindal 2023年10月12日
  1. 例:JavaScript の 3 項条件演算子
  2. 例:JavaScript のネストされた三項演算子
  3. 例:JavaScript の三項演算子での複数の操作
JavaScript 三項条件演算子

このチュートリアルでは、JavaScript で ?:条件演算子を使用する方法を紹介します。

if ... else ステートメントは、特定の条件が満たされた場合にのみ、特定のコードブロックを実行するのに役立ちます。三項演算子とも呼ばれる条件演算子は、if ... else ステートメントの 1 行の省略形です。クリーンで簡潔なコードを書くのに役立ちます。これは、評価する条件、条件が true の場合に実行する式、および条件が false の場合に実行する式の 3つのオペランドを必要とする唯一の JavaScript 演算子です。3つのオペランドを使用するため、その名前は三項演算子です。

condition ? expression1 : expression2

三項演算子は、最初に指定された condition を評価します。条件は、? によって expression1 から分離されます。expression2expression1 から:で区切られています。condition が true の場合、条件演算子は expression1 を実行し、そうでない場合は expression2 を実行します。

例:JavaScript の 3 項条件演算子

var age = 18;
var canVote;
if (age >= 18) {
  canVote = 'yes';
} else {
  canVote = 'no';
}

上記の例は、従来の if ... else ステートメントを使用して実行される条件ステートメントを示しています。

var age = 18;
var canVote = age >= 18 ? 'yes' : 'no';

三項演算子を使用して上記のコードを書き直しました。

例:JavaScript のネストされた三項演算子

if ... else ステートメントと同様に、ネストされた三項演算子を使用して複数の条件チェックを実行することもできます。

var carSpeed = 90;
var warning =
    speed >= 100 ? 'Way Too Fast!!' : (speed >= 80 ? 'Fast!!' : 'Nice :)');
console.log(warning);

上記のコードでは、車の速度に基づいて車の警告を生成します。まず、carSpeed が 100 を超えているかどうかを確認し、条件が満たされている場合は、車が Way Too Fast!!という警告を生成します。それ以外の場合は、carSpeed が 80 より大きいかどうかをチェックする 2 番目の式をネストし、評価に応じて Fast/Nice を表示します。

例:JavaScript の三項演算子での複数の操作

if ... else ステートメントのように、三項演算子内で複数の操作を実行できます。

let isStudent = true;
let primeVideo = 12;
isStudent ?
    (primeVideo = primeVideo / 2, alert('Enjoy your student discount')) :
    (alert('You have to pay full price'));

上記のコードでは、primeVideo の値を半分に変更してユーザーに警告する、1つではなく 2つの操作を実行します。

著者: Harshit Jindal
Harshit Jindal avatar Harshit Jindal avatar

Harshit Jindal has done his Bachelors in Computer Science Engineering(2021) from DTU. He has always been a problem solver and now turned that into his profession. Currently working at M365 Cloud Security team(Torus) on Cloud Security Services and Datacenter Buildout Automation.

LinkedIn

関連記事 - JavaScript Operator