JS学習記録第10回　AND条件OR条件について

こんにちは！JS学習記録も10回目になりました！
今回はAND条件OR条件についてまとめてみようかなと思います！
以前の比較演算子でもAND条件やOR条件を少し触ったのですが、少し奥が深いことが分かったので、その仕組みについてまとめます。

AND条件OR条件

前回の比較演算子でも使用したのですが、

AND条件が　&&
OR条件が　||
で表されます。

それぞれ、
&&　〜かつ
||　〜あるいは
よいうイメージでした。

では、以下のコードを見てみます。

const a = 0;
const b = 1;
console.log(a && b);
console.log(a || b);

この場合、それぞれのconsole.logはどう返却されるでしょうか。。。

結果として、AND条件には0、OR条件には1の値が出力されました！
ここが迷った点です_:(´ཀ`」 ∠):

AND条件とOR条件の意味

ここでなぜAND条件には0がOR条件には1が出力されたのでしょうか？
まず、１つ確認しておきたいのは、0はプログラミングで真偽値のfalseであるということです。
Booleanの式で0はfalse、1はfrueです。

AND条件式においては、
左から１つずつ、trueなのかfalseなのかを判断し、trueなら次の値を判断しに行き、falseの値ならばその値を出力するという性質があります。
どういうことかと言いますと、
const a = 0;　false
const b = 1;　true
console.log(a && b);
左から読んでいき、aの値はfalseなのでこの時点で0を返すことになります。

逆にOR条件においては、
左から１つずつ、trueなのかfalseなのかを判断し、falseの値があればその次の値を判断し、trueならそのままその値を出力するという性質があります。
const a = 0;　false
const b = 1;　true
console.log(a || b);
左から読んでいき、aの値はfalseなので次のbを読み、bはtrueなので1を出力します。

条件が３つの場合を見てみるとよくわかります！
例えばこの場合、

const a = 0;
const b = 1;
const c = 2;
console.log(b && a && c)
console.log(a || b || c)

console.log(b && a && c)に関して、
左から順に読んでいき、
b=1なので、true。
trueの場合は次の数字を読みます。
次はa=0なので、false。
falseの値を返すので、0と表示されます。

console.log(a || b || c)に関して、
左から順に読んでいき、
a=0なので、false。
falseの場合次の数字を読みます。
次はb＝1なので、true。
falseの値を返すので、1と表示されます。

条件式にはif分が多く用いられますが、以上のことからAND条件、OR条件でも同じような使い方ができます！

function hello(name) {
 name = name || 'taro';
 console.log('Hello ' + name);
}

hello('yuta')

この場合、関数helloに引数nameの値を付与し、
hello('yuta);
と関数実行することで、Hello yutaと出力されています。

コチラで注目するのは、
name = name || 'taro';
この式です。
先程の性質を使うと、
OR条件は、
左から１つずつ、trueなのかfalseなのかを判断し、falseの値があればその次の値を判断し、trueならそのままその値を出力するという性質があります。
もし、引数nameが空(false)ならば次の値taroを読み込むと言えます。

そのた以下のように出力することができます。

function hello(name) {
 name = name || 'taro';
 console.log('Hello ' + name);
}

hello();

まとめ

AND条件：左から１つずつ、trueなのかfalseなのかを判断し、trueなら次の値を判断しに行き、falseの値ならばその値を出力する。

OR条件：左から１つずつ、trueなのかfalseなのかを判断し、falseの値があればその次の値を判断し、trueならそのままその値を出力する。

以上のようになります。
条件分岐などでAND条件OR条件を使用して記述する人が多いのかどうか定かではありませんが、知っておいて損はないと思いました！