記事の概要
ショートサーキット評価とは、「もう答えが決まったら、それ以上は調べずに終わる」仕組みのことです。
JavaScriptでは&&
(AND, かつ)や||
(OR, または)を使う時によく使われます。
補足
この記事で「truthy(トゥルーシー)」と「falsy(フォルシー)」という言葉が出てきますので、念の為補足しておきます。
簡単にまとめると、truthyとはtrue
として扱われる値で、falsyとはfalse
として扱われる値です。
まとめ表を載せておきます。
値 | 判定 | 説明 |
---|---|---|
false | falsy | 本物の false |
0 | falsy | ゼロ |
'' | falsy | 空の文字列 |
null | falsy | 値がない |
undefined | falsy | 未定義 |
NaN | falsy | 数ではない |
'hello' | truthy | 空ではない文字列 |
1 , -3 , 100 | truthy | ゼロ以外の数 |
[] | truthy | 空でも配列 |
{} | truthy | 空でもオブジェクト |
結果のコード
では改めてコードから見てみましょう。(説明しやすいように行の初めに番号を振っています)
1 const hello = undefined || null || 0 || NaN || '' || 'Hello';
2 const bye = ' ' && 100 && [] && {} && 'Bye';
3 true && console.log('1.', hello); // 1. Hello
4 false && console.log('2.', hello); // 出力なし
5 true || console.log('3.', bye); // 出力なし
6 false || console.log('4.', bye); // 4. Bye
解説
1. const hello = undefined || null || 0 || NaN || '' || 'Hello';
||
は「最初に truthy な値を返す」演算子です。- 順に評価します:
undefined
→ falsynull
→ falsy0
→ falsyNaN
→ falsy''
(空文字)→ falsy'Hello'
→ truthy
⇒ 結果:hello
には 'Hello'
が代入されます。
2. const bye = ' ' && 100 && [] && {} && 'Bye';
&&
は「最初に falsy な値を返す」、または「すべて truthy なら最後の値を返す」演算子です。- 順に評価します:
' '
(空白文字)→ truthy100
→ truthy[]
→ truthy{}
→ truthy'Bye'
→ truthy
⇒ 結果:bye
には 'Bye'
が代入されます。
3. true && console.log('1.', hello);
true && 式
→ 最初がtrue
のため、後ろが評価されるconsole.log('1.', hello)
が実行される
⇒ 出力:1. Hello
4. false && console.log('2.', hello);
false && 式
→ 最初がfalse
のため、後ろは評価されない
⇒ 出力なし
5. true || console.log('3.', bye);
true || 式
→ 最初がtrue
のため、後ろは評価されない
⇒ 出力なし
6. false || console.log('4.', bye);
false || 式
→ 前がfalse
のため、後ろが評価される- →
console.log('4.', 'Bye')
が実行される
⇒ 出力:4. Bye
のようになります。
記載内容に誤りなどありましたらご指摘いただけますと幸いです。
コメント