JavaScript if

概要: このチュートリアルでは、条件が true のときにブロックを実行する JavaScript if 文の使用方法を学習します。

JavaScript if 文の紹介

if 文は、条件が true の場合にブロックを実行します。以下に if 文の構文を示します

if( condition )
   statement;Code language: JavaScript (javascript)

condition は、値または式にすることができます。通常、条件は 真偽値 (true または false) に評価されます。

condition が true に評価されると、if 文は statement を実行します。それ以外の場合は、if 文はその後の次の文に制御を渡します。

次のフローチャートは、if 文の仕組みを示しています

condition が真偽値以外の値に評価された場合、JavaScript は Boolean() 関数を呼び出してその結果を暗黙的に真偽値に変換します。

実行する文が複数ある場合は、次のように中かっこを使用してブロックで囲む必要があります

if (condition) {
  // statements to execute
}Code language: JavaScript (javascript)

ただし、if 文では常に中かっこを使用することをお勧めします。これにより、コードの保守が容易になり、潜在的な間違いを回避できます。

JavaScript if 文の例

次の例では、if 文を使用して年齢が 18 以上かどうかを確認します。

let age = 18;
if (age >= 18) {
  console.log('You can sign up');
}Code language: JavaScript (javascript)

出力

You can sign upCode language: JavaScript (javascript)

仕組み

まず、変数 age を宣言して 18 に初期化します。:  

let age = 18;Code language: JavaScript (javascript)

次に、if 文を使用して年齢が 18 以上かどうかを確認します。式 age >= 18 は true であるため、if 文内のコードが実行され、コンソールにメッセージが出力されます

if (age >= 18) {
  console.log('You can sign up');
}Code language: JavaScript (javascript)

次の例でも if 文を使用しています。ただし、age は 16 であるため、条件は false に評価されます。したがって、出力にメッセージは表示されません

let age = 16;
if (age >= 18) {
  console.log('You can sign up');
}Code language: JavaScript (javascript)

ネストした if 文

別の if 文内に if 文を使用できます。たとえば

let age = 16;
let state = 'CA';

if (state == 'CA') {
  if (age >= 16) {
    console.log('You can drive.');
  }
}Code language: JavaScript (javascript)

出力

You can drive.Code language: JavaScript (javascript)

仕組み

まず、age 変数と state 変数を宣言して初期化します

let age = 16;
let state = 'CA';Code language: JavaScript (javascript)

次に、if 文を使用して state が 'CA' かどうかを確認します。そうであれば、ネストした if 文を使用して age が 16 より大きいかどうかを確認し、コンソールにメッセージを出力します

if (state == 'CA') {
  if (age == 16) {
    console.log('You can drive.');
  }
}Code language: JavaScript (javascript)

実際には、ネストした if 文は極力避けてください。たとえば、&& 演算子を使用して条件を結合し、if 文を次のように使用できます

let age = 16;
let state = 'CA';

if (state == 'CA' && age == 16) {
  console.log('You can drive.');
}Code language: JavaScript (javascript)

概要

• 条件が true のときに文を実行する JavaScript if 文を使用します。
• ネストした if 文は極力使用しないでください。