何をする書き方？
for...ofは配列などの値をひとつずつ取り出します。取り出した値に名前を付け、繰り返しの中で使えます。まずは配列の各項目を表示する例から始めましょう。
基本の形
for (const 項目 of 配列) {
処理
}for...of値を順番に取り出す。of取り出す元のデータを指定。{}繰り返す処理の範囲。短い例で確かめる
app.js
for (let i = 1; i <= 3; i++) {
console.log(i);
}結果
1
2
3
準備・実行方法を確認する
計算や配列の例は、ブラウザーの開発者ツールのConsoleに貼り付けて実行できます。画面操作の例は、必要なHTML要素を置き、defer付きscriptでapp.jsを読み込んでください。
もう少し詳しいコードを見る
app.js
const skills = ["HTML", "CSS", "JavaScript"];
for (const skill of skills) {
console.log(skill + "を学ぶ");
}結果
HTMLを学ぶ
CSSを学ぶ
JavaScriptを学ぶ
ここで、書き換えてみよう
文字や数字を変えたら「実行する」を押します。変更したコードは、ページを移動すると元に戻ります。
実行すると、ここに結果が出ます。
一問だけ、復習しよう
「繰り返し」の書き方はどれ？
少し変えてみよう
配列に"Python"を追加して、表示する行が増えることを確かめましょう。
つまずいたら、ここを確認
for...inは主にプロパティ名を扱います。配列の値を取り出すときはfor...ofを使うと分かりやすいです。
自分の言葉でメモ
記録はこのブラウザーに保存されます。