Merge pull request #393 from ut-code/add-increment-operator-explanation-to-loop

複合演算子を初出の場所に移動

Author: aster-void

docs/1-trial-session/08-loop/_samples/answer-while/script.js

@@ -1,7 +1,7 @@
 let i = 1;
 let sum = 0;
 while (i <= 10) {
-  sum += i;
-  i += 1;
+  sum = sum + i;
+  i = i + 1;
 }
 document.write(sum);

docs/1-trial-session/08-loop/index.md

@@ -16,7 +16,7 @@ while 文を用いると、ある条件が満たされている間実行され
 let i = 0;
 while (i < 5) {
   document.write(i);
-  i += 1;
+  i = i + 1;
 }
 document.write("終了");
 ```
@@ -43,7 +43,7 @@ while (条件式) {
 
 1 から 10 までの整数の合計を計算するプログラムを作ってみましょう。
 
-:::tip ヒント
+:::tip
 
 `1` から `10` まで順番に増えていく変数 `i` と、合計値を保存しておく変数 `sum` を用意しましょう。
 
@@ -55,8 +55,8 @@ while (条件式) {
 let i = 1;
 let sum = 0;
 while (i <= 10) {
-  sum += i;
-  i += 1;
+  sum = sum + i;
+  i = i + 1;
 }
 document.write(sum);
 ```
@@ -65,6 +65,46 @@ document.write(sum);
 
 </Answer>
 
+:::tip 複合代入演算子
+
+[**複合代入演算子**](https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Expressions_and_Operators#%E4%BB%A3%E5%85%A5%E6%BC%94%E7%AE%97%E5%AD%90) は、計算と代入を同時に行うことができる演算子です。
+
+`x += y` は、`x = x + y` という意味になります。他にも `-=` や `*=` などの演算子が定義されています。`x -= y` は`x = x - y`、`x *= y` は`x = x * y` という意味になります。
+
+複合代入演算子を用いると、
+
+```javascript
+i = i + 1;
+```
+
+は以下のように書き換えることができます。
+
+```javascript
+i += 1;
+```
+
+<!-- 教えるかどうか議論
+[**インクリメント演算子**](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Increment) は、与えられた変数に1を足します。
+一方、[**デクリメント演算子**](https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Operators/Decrement) は、与えられた変数から1を引きます。
+
+`x++` は `x = x + 1`（＝`x += 1`）、 `y--` は `y = y - 1` （＝`y -= 1`） という意味になります。
+インクリメント演算子を使うと、
+
+```javascript
+i = i + 1;
+```
+
+は以下のように書き換えることができます。
+
+```javascript
+i++;
+```
+
+-->
+
+:::
+
+
 ## for 文
 
 `for` 文は、`while` 文にほんの少しだけ機能を追加したものになります。

docs/1-trial-session/11-object/index.md

@@ -50,26 +50,11 @@ let person = {
 
 ドット記号を用いることで、<Term type="javascriptObject">オブジェクト</Term>の<Term type="javascriptProperty">プロパティ</Term>を取得・変更できます。通常の<Term type="javascriptVariable">変数</Term>のように扱えます。
 
-```javascript
-person.age = person.age + 1;
-document.write(person.age);
-```
-
-:::tip 複合代入演算子
-
-[複合代入演算子](https://developer.mozilla.org/ja/docs/Web/JavaScript/Guide/Expressions_and_Operators#%E4%BB%A3%E5%85%A5%E6%BC%94%E7%AE%97%E5%AD%90)は、計算と代入を同時に行うことができる演算子です。
-
-`x += y` は、`x = x + y` という意味になります。他にも `-=` や `*=` などの演算子が定義されています。`x -= y` は`x = x - y`、`x *= y` は`x = x * y` という意味になります。
-
-複合代入演算子を用いると、先ほどのプログラムは以下のように書くことができます。
-
 ```javascript
 person.age += 1;
 document.write(person.age);
 ```
 
-:::
-
 ## 課題
 
 <p><Term type="javascriptObject">オブジェクト</Term>も<Term type="javascriptValue">値</Term>の一種なので、<Term type="javascriptFunction">関数</Term>の<Term type="javascriptParameter">引数</Term>や<Term type="javascriptReturnValue">戻り値</Term>として使用できます。</p>