【永久保存版】「||」とか「&&」ってなんやねん

結論

論理演算子と言います。
どうぞよろしくお願いします。

前提知識

• 論理演算子は左から右という順番で評価をする
• 論理演算子が返す値は基本的には真偽値(true or false)です。
  • ただ、真偽値以外も返すことができます。
  • それは後程説明します。

解説

「||」

• any1　||　any2のどちらかがtrueであればtrueを返す。
  • any1がfalseの場合any2を見て、any2もfalseだった場合初めてfalseを返し、trueであればtrueを返す。
  • つまり、どちらもfalseでなければfalseを返さない。

a1 = true || true // true
a2 = true || false // true
a3 = false || true // true
a4 = false || false // false
a5 = (1 === 1) || false // true
a6 = false || (1 === 2) // false

• 文字列も使用することができる。
  • が、その場合、必ずtrue判定(?)になる

a1 = "dog" || "cat" // "dog"
a2 = false || "cat" // "cat"
a3 = "dog" || false // "dog"

「&&」

• any1　&&　any2のどちらもtrueであればtrueを返す
  • any1がtrueの場合any2を見て、any2もtrueであればtrueを返し、falseであればfalseを返す。

a1 = true && true // true
a2 = true && false // false
a3 = false && true // false
a4 = false && false // false
a5 = (1 === 1) && true // true
a6 = true && (1 === 2) // false

• 「||」と同様、文字列を使用することができます。
  • が、文字列同士を比較した場合、「||」と違い、後ろの文字列を返す

a1 = "dog" && "cat" // "cat"
a2 = false && "cat" // false
a3 = "dog" && false // false

慣れてきた方へ

ショートサーキット評価

• 論理演算子の左から右の順番で評価する仕様を利用した記法。
• これにより、無駄な関数を動かさないようにして軽くしたりすることが可能。

例

heavyFunction() {
  for(let i = 0; i < 100; i++) {
    console.log('無駄に重い関数', i)
  }
}

if (true || heavyFunction()) {
  console.log('||のショートサーキット評価')
}
if(false && heavyFunction()) {
  console.log('&&のショートサーキット評価')
}    

• ||は左がtrueの時点で右を見る必要もないのでtrueを返す。
• &&は左がfalseの時点で右を見る必要もないのでfalseを返す。

結果、無駄に重いheavyFunction()を呼ばなくて済み、動作を軽くすることができます！