ループの中のループ
ループを入れ子にします
「ループの中のループ」はCoddyKit上の無料Javascript for Kidsレッスンです。 これはレッスン1/4です。 下記で完全なレッスンを無料で読むことができます。その後、ブラウザ内の組み込みコードエディタと24時間対応のAIチューターでハンズオン演習できます。 これはJavascript for Kids学習パスの一部であり、ウェブとCoddyKitアプリ全体で進捗が同期されます。 Javascript for Kidsコースには全4レッスンが含まれています。
ループの中にループ！？ 🤯
1つのループの中に別のループを入れたらどうなるでしょう？大きな車輪の中で小さな車輪が回るようなものです！⚙️⚙️
これはネストしたループと呼ばれ、すばらしいアートを作れます！
外側と内側 🪆
入れ子人形を思い浮かべてください！🪆 外側のループが大きな人形で、内側のループが中にある小さな人形です。
外側のループが1回繰り返されるたびに、内側のループはすべての繰り返しを実行します！
初めてのネストしたループ 🔁
ここでは外側のループが2回実行されます。そのたびに、内側のループが3回実行されます！よく見てみましょう。
for (let i = 1; i <= 2; i++) {
for (let j = 1; j <= 3; j++) {
console.log('i=' + i + ' j=' + j)
}
}カウンターが2つ！ ✌️
見てください。今度はカウンターが2つあります。外側のループ用がi、内側のループ用がjです。
外側のiが変わるたびに、内側のjは1、2、3と進みます！
for (let i = 1; i <= 2; i++) {
console.log('Outer ' + i + ' starts')
for (let j = 1; j <= 2; j++) {
console.log(' inner ' + j)
}
}合計で何回ですか 🔢
外側が3回、内側が4回実行される場合、合計は3 × 4 = 12回です！
数えてみましょう。
let count = 0
for (let i = 1; i <= 3; i++) {
for (let j = 1; j <= 4; j++) {
count = count + 1
}
}
console.log('Total runs: ' + count)日と食事 🍽️
実例です！1日ごとに、3回食事をします。外側のループが日、内側のループが食事を表します。
for (let day = 1; day <= 2; day++) {
console.log('Day ' + day)
for (let meal = 1; meal <= 3; meal++) {
console.log(' meal ' + meal)
}
}行に並ぶ星 ⭐
外側のループが行を作り、内側のループがその行に星を表示します。アートの先取りです！
for (let row = 1; row <= 3; row++) {
for (let s = 1; s <= 2; s++) {
console.log('star')
}
console.log('--- end of row ---')
}順番が大切です 📋
内側のループは、外側のループが次に進む前に、必ずすべての繰り返しを終えます。次の行へ進む前に、その行のすべての単語を読むようなものです！📖
for (let i = 1; i <= 2; i++) {
for (let j = 1; j <= 2; j++) {
console.log(i + ',' + j)
}
}数を掛け合わせる ✖️
ネストしたループは計算にも最適です！iとjを掛け合わせてみましょう。
for (let i = 1; i <= 2; i++) {
for (let j = 1; j <= 3; j++) {
console.log(i + ' x ' + j + ' = ' + (i * j))
}
}服の組み合わせを選ぶ 👕👖
シャツ2枚とズボン2本で、4通りの服装ができます！ネストしたループですべての組み合わせを表示できます。
for (let shirt = 1; shirt <= 2; shirt++) {
for (let pants = 1; pants <= 2; pants++) {
console.log('Shirt ' + shirt + ' with pants ' + pants)
}
}ネストしてみましょう 🌟
内側のループを4回実行するように変えて、実行してみてください！出力がどのように増えるか見てみましょう。🪆
for (let i = 1; i <= 2; i++) {
for (let j = 1; j <= 4; j++) {
console.log('i=' + i + ' j=' + j)
}
}クイックチェック ✅
ネストしたループの理解度チェックです！🧠
ネストしたループのまとめ 🎉
驚きましたか！🤯 ネストしたループを学びました。
- 入れ子人形のように、ループの中にループを入れます 🪆
- 外側のカウンターは
i、内側のカウンターはjです - 外側が次に進む前に、内側がすべての繰り返しを終えます
次は、グリッドのように行と列を作ります！🟦
よくある質問
「ループの中のループ」レッスンは無料ですか？
はい。「ループの中のループ」の完全なテキストはこのウェブで無料で読めます。インタラクティブに演習し（組み込みコードエディタと24時間対応のAIチューター）、Javascript for Kidsコースの残りをアンロックするには、CoddyKit PROにアップグレードしてください。 Javascript for Kidsコースには全4レッスンが含まれています。
「ループの中のループ」で何を学びますか？
ループを入れ子にします ブラウザで直接実行するハンズオンコードでJavascript for Kidsを演習し、24時間対応のAIチューターがレッスンを進める中での質問に答えます。
Javascript for Kidsを始めるのに経験は必要ですか？
事前経験は必要ありません。CoddyKitのJavascript for Kidsは初級者から上級者向けに構成されているため、ここから始めるか最初から始めて、自分のペースで進むことができます。 これはレッスン1/4です。
「ループの中のループ」レッスンにはどのくらい時間がかかりますか？
ほとんどのCoddyKitレッスンは約5～10分かかります。各レッスンはコンパクトでインタラクティブなので、着実に進歩し、ウェブとアプリ全体で正確に前回の場所から再開できます。
このJavascript for Kidsレッスンでコードを書いて実行できますか？
はい。すべてのJavascript for Kidsレッスンに組み込みコードエディタが含まれているため、ブラウザでリアルコードを書いて実行し、即座のAIフィードバックを取得できます。ローカル設定は不要です。