for文の中でのインクリメントについて

Question

const data = [1, 2, 3, 4, 5];

for (let i = 0; i < data.length; i++) { 
  console.log(i++);
}

この出力結果が、0, 2, 4となるのはなぜでしょうか？

Comments

[og24715]

twin_bird さんの考えではどのような結果になると予想したのですか？

[twin_bird]

4回繰り返されて、0, 1, 2, 3という出力が得られると思っていました

Answer 1

処理的には

//1周目
let i = 0 // iに初期値0を代入
i < data.length //iがdata.length(=5)未満なのでループ内を実行
console.log(i++) //iを表示後i(=0)をインクリメントする(i=1)

//2周目
i++ //iをインクリメントして2になる
i < data.length //iがdata.length(=5)未満なのでループ内を実行
console.log(i++) //iを表示後i(=2)をインクリメントする(i=3)

//3周目
i++ //iをインクリメントして4になる
i < data.length //iがdata.length(=5)未満なのでループ内を実行
console.log(i++) //iを表示後i(=4)をインクリメントする(i=5)

//4周目
i++ //iをインクリメントして6になる
i < data.length //iがdata.length以上なのでループを終了

結論：カウンタで利用しているiを書き換えてはいけません

Answer 2

for( ① ; ② ; ③ ){

}

for文の（）の中には3つの文が入りますが、その中の③は、各ループが終了したときに実行される文になります。
示されているコードの場合、console.log(i++);を行った後に③のi++が実行sれます。
結果i++が2回実行されていることになります。

Answer 3

そりゃループの中で　i++ してるからです。
そのコードがどういう動作をするのか１行づつ追っていけばどうでしょうか

Answer 4

自己解決しました。

1回目は0
2回目は2（if文の条件内でインクリメントが1回、内部で一回）
3回目は4（上に同じ）
処理が終了（4が終了条件なため）