diff --git a/docs/1-trial-session/05-expressions/addition-operator-evaluation.png b/docs/1-trial-session/05-expressions/addition-operator-evaluation.png new file mode 100644 index 000000000..d3fce9bbc Binary files /dev/null and b/docs/1-trial-session/05-expressions/addition-operator-evaluation.png differ diff --git a/docs/1-trial-session/05-expressions/index.mdx b/docs/1-trial-session/05-expressions/index.mdx index 4db31ff34..a61322207 100644 --- a/docs/1-trial-session/05-expressions/index.mdx +++ b/docs/1-trial-session/05-expressions/index.mdx @@ -43,6 +43,8 @@ document.write(3 + 4 * 5); `3 + 4 * 5`の評価は、先に`4 * 5`が評価されて`20`になり、次に`3 + 20`が評価されることにより、`23`という値となると考えることができます。 +![3 + 4 * 5の評価](./operator-priority-evaluation.png) + ## いろいろな演算子 {/* prettier-ignore */} @@ -67,6 +69,8 @@ document.write("Hello" + 1 + 2); `+`は、両辺が数値の場合のみ加算演算子として振る舞い、片方が数値で片方が文字列の場合は数値を文字列に変換してから文字列結合演算子として機能します。このため、最終的な式全体の評価結果は前者が`"7Hello"`、後者が`"Hello12"`となるのです。 +![3 + 4 + "Hello"と"Hello" + 1 + 2の評価](./addition-operator-evaluation.png) + ### 代表的な演算子 | 演算子 | 意味 | 例 | diff --git a/docs/1-trial-session/05-expressions/operator-priority-evaluation.png b/docs/1-trial-session/05-expressions/operator-priority-evaluation.png new file mode 100644 index 000000000..ced0e4096 Binary files /dev/null and b/docs/1-trial-session/05-expressions/operator-priority-evaluation.png differ diff --git a/docs/1-trial-session/06-variables/reassignment-evaluation.png b/docs/1-trial-session/06-variables/reassignment-evaluation.png index b40747df8..f9a27b2f7 100644 Binary files a/docs/1-trial-session/06-variables/reassignment-evaluation.png and b/docs/1-trial-session/06-variables/reassignment-evaluation.png differ diff --git a/docs/1-trial-session/07-boolean/assignment-operator-evaluation.png b/docs/1-trial-session/07-boolean/assignment-operator-evaluation.png new file mode 100644 index 000000000..8f725de83 Binary files /dev/null and b/docs/1-trial-session/07-boolean/assignment-operator-evaluation.png differ diff --git a/docs/1-trial-session/07-boolean/chained-comparison-evaluation.png b/docs/1-trial-session/07-boolean/chained-comparison-evaluation.png new file mode 100644 index 000000000..c23b6d492 Binary files /dev/null and b/docs/1-trial-session/07-boolean/chained-comparison-evaluation.png differ diff --git a/docs/1-trial-session/07-boolean/index.mdx b/docs/1-trial-session/07-boolean/index.mdx index 09dc89bb4..edd8d6130 100644 --- a/docs/1-trial-session/07-boolean/index.mdx +++ b/docs/1-trial-session/07-boolean/index.mdx @@ -83,6 +83,9 @@ const canRideRollerCoasters = age >= 10 && height >= 120; // true 次のコードは何を表示するでしょうか。そしてそれはなぜでしょうか。 +- JavaScript で、数値と論理値に比較演算子を適用すると、`true`は`1`として、`false`は`0`として比較されます。 +- `=`は代入演算子です。代入演算子の式が評価されると、右辺の値になります。 + {/* prettier-ignore */} ```javascript let takaoHeight = 599; @@ -94,8 +97,18 @@ document.write(takaoHeight = everestHeight); -- JavaScript で、数値と論理値に比較演算子を適用すると、`true`は`1`として、`false`は`0`として比較されます。 -- `=`は代入演算子です。代入演算子の式が評価されると、右辺の値になります。 + + +`<`の結合規則は左から右なので、`takaoHeight < everestHeight < fujiHeight`は`(takaoHeight < everestHeight) < fujiHeight`と解釈されることになります。 +まず`takaoHeight < everestHeight`が評価され、`true`になります。次に`true < fujiHeight`が評価されます。`true`は`1`として比較されるため、結果は`true`になります。 + +![takaoHeight < everestHeight < fujiHeightの評価](./chained-comparison-evaluation.png) + +`takaoHeight = everestHeight`の評価結果は、右辺の評価結果である`8849`になります。 + +![takaoHeight = everestHeightの評価](./assignment-operator-evaluation.png) + + :::