JavaScript | if、else-ifをショートハンドで記述する方法

JavaScript ショートハンド,JavaScript

ifのショートハンドのサンプル

if文をショートハンドにしたサンプルコードを紹介しています。

ロングハンド

通常のif文のJavaScriptコードです。

let item = true
let val

if (item) {
    val = 1;
}

// val = 1

ショートハンド

ifをショートハンドにするには「{}」を「?~:」に置き換えます、elseにあたる「:」も記述しないとエラーとなります。

条件式 ? 処理 :

上記のロングハンドコードをショートハンドコードにしていきます。

また、変数の宣言もショートハンドにしています。

let item = true, val

(item) ? val = 1 :

// val = 1

括弧なしのショートハンドです。

「()」は記述しなくてもif文として機能します。

let item = true, val

item ? val = 1 :

// val = 1

結果を変数に入れる記述パターンです。

let item = true, val

val = item ? 1 :

// val = 1

結果を格納する変数を宣言しながら記述する事も可能です。

let item = true

let val = item ? 1 :

// val = 1

if ~ elseのショートハンドのサンプル

if ~ else文をショートハンドにしたJavaScriptコードを紹介しています。

ロングハンド

通常のif ~ elseのJavaScriptコードです。

let item = true
let val

if (item) {
    val = 1;
} else {
    val = 2;
}

// val = 1

ショートハンド

elseを含むif文をショートハンドにする場合は条件式の後に「?」、elseの部分には「:」を記述します。

条件式 ? 処理 : 処理

上記のロングハンドコードをそのままショートハンドコードに書き換えると以下のようになります。

let item = true, val

(item) ? val = 1 : val = 2

// val = 1

elseを使った括弧なしショートハンドコードです。

「()」は記述しなくてもif文として機能します。

let item = true, val

item ? val = 1 : val = 2

// val = 1

elseを使った括弧なしショートハンドで分岐内で指定せずに結果を変数に入れる記述パターンです。

let item = true, val

val = name ? 1 : 2

// val = 1

elseを使った宣言付き、括弧なしショートハンド。

結果を格納する変数を宣言しながら記述する事も可能です。

let item = true

let val = name ? 1 : 2

// val = 1

else-ifを含めたショートハンドのサンプル

if文にelse-ifも使ったショートハンド記述のサンプルコードになります。

ロングハンド

else-ifを使った括弧ありのショートハンド、通常の記述パターン。

let item = 'banana'
let val

if (item == 'apple') {
    val = 1
} else if (item == 'banana'){
    val = 2
} else {
    val = 3
}

// val = 2

ショートハンド

else-ifを使った括弧ありのショートハンドコードです。

else-ifをショートハンドにする場合、続けて分岐させる条件の後ろに「?」を追加する事でショートハンドで記述する事が可能になっています。

条件式 ? 処理 : 条件式 ? 処理 : 処理
let item = 'banana', val

(item == 'apple') ? val = 1 : (item = 'banana') ? val = 2 : val = 3

console.log(val)

// val = 2

else-ifを使った括弧なしのショートハンド。

let item = 'banana', value

item == 'apple' ? val = 1 : item = 'banana' ? val = 2 : val = 3

console.log(val)

// val = 2

else-ifを使った括弧なし・宣言付きショートハンド。

let item = 'banana'

let val = item == 'apple' ? 1 : item = 'banana' ? 2 : 3

console.log(val)

// val = 2