条件分岐 if
JavaScript の if 文はカッコ内の式を評価して、結果を Boolean型 に変換し true であれば処理を実行します。
false であれば else の処理を実行します。
let x = 'JavaScript' ; if ( x == 'JavaScript' ) { // true console.log( 'JavaScript !' ) ; } else { console.log( 'PHP' ) ; } // JavaScript !
JavaScript の Boolean への変換例
Boolean型への変換時に、0 (数値型)、” (文字列型空文字)、 null、undefined 、NaN のときに false となります。
console.log( Boolean(0) ) ; // false *** console.log( Boolean(1) ) ; // true console.log( Boolean(2) ) ; // true console.log( Boolean(3) ) ; // true console.log( Boolean('') ) ; // false *** console.log( Boolean('A') ) ; // true console.log( Boolean('B') ) ; // true console.log( Boolean(null) ) ; // false *** console.log( Boolean( undefined ) ) ; // false *** console.log( Boolean( NaN ) ) ; // false ***
else if
複数の条件分岐を評価する場合は else if で条件をつなぎます。
let x = 'PHP' ; if ( x == 'JavaScript' ) { console.log( 'JavaScript !' ) ; } else if ( x == 'PHP' ) { console.log( 'PHP !' ) ; } else if ( x == 'Python' ) { console.log( 'Python !' ) ; } else { console.log( 'Other !' ) ; } // PHP !
三項演算子
条件の評価により値を返す必要がある場合に利用されます。
let result = condition ? trueValue : falseValue ;
condition が評価されて、ture であれば trueValue を、 false であれば falseValue を result へ返します。
let x = 'JavaScript' ; let result = ( x == 'JavaScript' ) ? 'JavaScript !' : 'Other !' ; console.log ( result ) ; // JavaScript !
if … else で置き換えると次になります。
let x = 'JavaScript' ; let result ; if ( x == 'JavaScript' ) { result = 'JavaScript !' ; } else { result = 'Other !' ; } console.log ( result ) ; // JavaScript !
複数の条件をつなぐこともできます。
let x = 'PHP' ; let result = ( x == 'JavaScript' ) ? 'JavaScript !' : ( x == 'PHP' ) ? 'PHP !' : ( x == 'Python' ) ? 'Python !' : 'Other !' ; console.log ( result ) ; // PHP !
if … else if で置き換えると次になります。
let x = 'PHP' ; let result ; if ( x == 'JavaScript' ) { result = 'JavaScript !' ; } else if ( x == 'PHP' ) { result = 'PHP !' ; } else if ( x == 'Python' ) { result = 'Python !' ; } else { result = 'Other !' ; } console.log ( result ) ; // PHP !
参考リンク
MDN 開発者向けのウェブ技術 > if…else
MDN 開発者向けのウェブ技術 > 条件 (三項) 演算子
MDN 開発者向けのウェブ技術 > 式と演算子
MDN 開発者向けのウェブ技術 > JavaScript「再」入門