Javascriptの演算子やら&&やら||やらを備忘録


Jsで詰まったところを残しておくメモ。


#その1
この２つの式は同じ。(※厳密には異なります、ちょっと下の「ワンポイント：true扱いされる値とfalse扱いされる値」を参照)

```javascript:javascript
var hensu = a && b && c;
```

```javascript:javascript
var hensu;
if(a == false){
	hensu = a;
}else if(b == false){
	hensu = b;
}else{
	hensu = c;
}
```

`a`が「true扱いされる値」なら次に進み、「false扱いされる値」が出たらその時点での値を返す。
たとえば、`a = 1`、`b = "素数"`、`c = 0`、なら、aもbもtrue扱いなのでスルーされ、`hensu = 0`となる。



####ワンポイント：条件式と返り値
たとえば`var hensu = (a > 20);`で、`a = 10`だった場合、
`hensu`に入る値は`false`となる。`a = 22`なら、`hensu`に入る値は`true`。
条件式にすると**値そのものではなく真偽値を返す**というのはつまづきやすい部分だ。




####or条件の場合
なお、`&&`ではなく`||`を利用すると逆のことが起こる。

```javascript:javascript
var hensu = a || b || c;
```

```javascript:javascript
var hensu;
if(a == true){
	hensu = a;
}else if(b == true){
	hensu = b;
}else{
	hensu = c;
}
```

こちらはaがfalse扱いされる値ならbに進み、bでもfalse扱いされるならcに移動している。
たとえば、`a = 0`、`b = "はなまるぴっぴ"`、`c = undefined`、なら、hensuには最初に出たtrue値であるbが入る、`hensu = "はなまるぴっぴ"`となる。

####ワンポイント：true扱いされる値とfalse扱いされる値
わざわざtrue、falseではなく、true「扱いされる値」とfalse「扱いされる値」と書いてあるのには理由がある。
というのも、コンピューターの言う「false」は複数存在するのだ。

Javascriptでは以下の8種類の値が「false」とみなされる。
`0` `-0` `null` `false` `NaN` `undefined` `空の文字列( "" '' )`

逆に言えばそれ以外の値は「trueである」と認識されるというわけだ。
勘違いのないように言っておくと、`"NaN"`とか`'null'`とか書くと**trueとして通ってしまう。**


#その2
この２つの式は同じ。

```javascript:javascript
 var c = a == 15 && 'this is 15' || 'not 15';
```

```javascript:javascript
var c;
if(a == 15){
    c = 'this is 15';
}else{
    c = 'not 15';
}
```

「その1」の原理を使った応用。
`var c = ((a == 15 && 'this is 15') || 'not 15');`と補ってやるとわかりやすいだろう。
まず、a == 15がtrueかfalseかがチェックされる。
trueなら`a == 15`がスルーされ、`(a == 15 && 'this is 15')`は`'this is 15'`で確定する。
そんで`('this is 15' || 'not 15')`の式に回されるのだが、`||`はtrueの値が出た時点で処理を終えてその先には進まないため
`c = 'this is 15'`となる。

falseなら`(a == 15 && 'this is 15')`はfalseで確定し、`(false || 'not 15')`の式に回される。
先述した通り`||`はfalseをスルーするので最終的な値は`'not 15'`になる、でそれがcに代入されて
`c = 'not 15'`というわけだ。



#その3
上の「ワンポイント：条件式と返り値」で書いた通り、
条件式を書く、つまり`>`、`<`、`==`、`!`を使うとその値は強制的にtrueかfalseに変換される。
これを応用して、以下のような式を組むことができる。

以下の２つの式は同じである。

```javascript:javascript
var B = !(A % 4);
```

```javascript:javascript
var B;
if(A % 4 === 0){
	B = true;
}else{
	B = false;
}
```

こちらは、余りが出るかどうかを判断する式。
余りが出ない＝余りは0＝0はfalse扱い、という解釈により、`!(A % 4)`とすると、Aが4で割れる数ならtrue、Aが4で割れない数ならfalseが返される。

なお、`!(14 - 14)`という式を書くとtrueが返される。


#その4
この２つの式は同じ。
[こちらの記事](https://qiita.com/smicle/items/7d3b9881834dc0142fb7)が秀逸な解説だったのでそちらから引用。。。

```javascript:javascript
var result;
if(str === 'piyo'){
  result = 'piyo！！';
} else {
  result = 'not piyo…';
}
```

```javascript:javascript
var result;
result = str === 'piyo' ? 'piyo！！' : 'not piyo…'
```

#その5
カンマの使い方。

```javascript:javascript
// 一気に変数を定義できる！（中身はundefinedになります）
var a, b, c, d;

// 最後の行に ; がついてさえいれば、
// 途中のコードの文末を,にしても大丈夫！
console.log(a),
console.log(b),
console.log(c),
console.log(d);

// 値を仕込みたい場合は = でつなぐ
var e = f = g = h = 'marufoi! ';

console.log(e + f + g + h);


a = 1;
b = 2;
c = 3;

// 代入が優先されるので、1が入る
var kon01 = a, b, c;
console.log(kon01); // 1

// 左から順番に実行（するので、3が入る）
var kon02 = (a, b, c);
console.log(kon02); // 3
```



#参考文献
https://qiita.com/smicle/items/7d3b9881834dc0142fb7
https://qiita.com/Imamotty/items/bc659569239379dded55
https://qiita.com/amamamaou/items/785d1fa6f32d5586ed49
https://teratail.com/questions/38967

https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Logical_Operators