JavaScript | 1 日 90 分 × 7 日アプリ学習：ランダム表示アプリ（初級編）

5日目のゴールと今日やること

5日目のテーマは
「繰り返しカウントを“アプリっぽく”まとめる」 ことです。

ここまでであなたはすでに、

• for と range で、数え方をデザインできる
• カウントアップ、カウントダウン、ステップ付きカウントが書ける
• 回数によってメッセージを変えることができる

というところまで来ています。

今日はこれらを組み合わせて、

「トレーニング用カウンター」
「残り回数を教えてくれるカウンター」

のような、“使い道がイメージできるカウンター” を作っていきます。

今日の軸になる考え方「今何回目」と「あと何回」

2つの視点を同時に持つ

カウンターアプリでよく出てくるのが、この2つです。

「今、何回目か」
「あと、何回残っているか」

例えば、腕立て10回のトレーニングなら、

1回目 → 残り9回
2回目 → 残り8回
…
10回目 → 残り0回

というふうに、
「今」と「残り」がセットで動いています。

Python でこれを表現するには、

• i で「今何回目か」を表す
• total - i で「残り何回か」を計算する

という形が自然です。

この「今」と「残り」を同時に扱う感覚が、
今日の中心になります。

「今」と「残り」を同時に表示するカウンター

total を決めてから、for で回す

まずは、シンプルな例から。

total = 5

for i in range(1, total + 1):
    print("今は", i, "回目")
    print("残りは", total - i, "回です")
    print("-----")

total = 5

for i in range(1, total + 1):
    print("今は", i, "回目")
    print("残りは", total - i, "回です")
    print("-----")

実行すると、こうなります。

今は 1 回目
残りは 4 回です
-----
今は 2 回目
残りは 3 回です
-----
今は 3 回目
残りは 2 回です
-----
今は 4 回目
残りは 1 回です
-----
今は 5 回目
残りは 0 回です
-----

ここでのポイントは、とてもシンプルです。

• total は「全部で何回やるか」
• i は「今何回目か」
• total - i は「残り何回か」

という役割を持っています。

「今」と「残り」を同時に出すだけで、
一気に“トレーニングカウンター感”が出てきます。

トレーニング風カウンターにしてみる

メッセージを少し変えるだけで雰囲気が変わる

さっきのコードを、少しだけトレーニング風にしてみましょう。

total = 5

print("===== トレーニングカウンター 5 日目 =====")
print()
print("全部で", total, "回やります。")
print()

for i in range(1, total + 1):
    print("▶", i, "回目！")
    print("   がんばれ！")
    print("   残りは", total - i, "回です。")
    print()

print("おつかれさまでした！")
print("今日のトレーニングは完了です。")

total = 5

print("===== トレーニングカウンター 5 日目 =====")
print()
print("全部で", total, "回やります。")
print()

for i in range(1, total + 1):
    print("▶", i, "回目！")
    print("   がんばれ！")
    print("   残りは", total - i, "回です。")
    print()

print("おつかれさまでした！")
print("今日のトレーニングは完了です。")

実行すると、例えばこんな感じになります。

===== トレーニングカウンター 5 日目 =====

全部で 5 回やります。

▶ 1 回目！
   がんばれ！
   残りは 4 回です。

▶ 2 回目！
   がんばれ！
   残りは 3 回です。

▶ 3 回目！
   がんばれ！
   残りは 2 回です。

▶ 4 回目！
   がんばれ！
   残りは 1 回です。

▶ 5 回目！
   がんばれ！
   残りは 0 回です。

おつかれさまでした！
今日のトレーニングは完了です。

ここでやっていることは、
実はさっきとほとんど同じです。

でも、

• タイトルをつける
• 「▶」やインデントを入れて見た目を整える
• 「がんばれ！」のようなメッセージを足す

だけで、かなり“アプリっぽく”なります。

「最後の1回だけ特別メッセージ」を足す

if を組み合わせて、ラストを盛り上げる

トレーニングっぽくするなら、
最後の1回だけ特別なメッセージを出したくなりますよね。

さっきのコードに、if を足してみます。

total = 5

print("===== トレーニングカウンター 5 日目 =====")
print()
print("全部で", total, "回やります。")
print()

for i in range(1, total + 1):
    print("▶", i, "回目！")
    
    if i == total:
        print("   ラスト！ 全力でいこう！")
    else:
        print("   がんばれ！")
        print("   残りは", total - i, "回です。")
    
    print()

print("おつかれさまでした！")
print("今日のトレーニングは完了です。")

total = 5

print("===== トレーニングカウンター 5 日目 =====")
print()
print("全部で", total, "回やります。")
print()

for i in range(1, total + 1):
    print("▶", i, "回目！")
    
    if i == total:
        print("   ラスト！ 全力でいこう！")
    else:
        print("   がんばれ！")
        print("   残りは", total - i, "回です。")
    
    print()

print("おつかれさまでした！")
print("今日のトレーニングは完了です。")

実行すると、最後だけメッセージが変わります。

▶ 4 回目！
   がんばれ！
   残りは 1 回です。

▶ 5 回目！
   ラスト！ 全力でいこう！

おつかれさまでした！

ここでの重要ポイントは、

• if i == total: で「最後の回かどうか」を判定している
• 最後の回だけ「残り回数」を表示していない

ということです。

「回数によってメッセージを変える」
という3日目の内容が、
「今」と「残り」と組み合わさって、
より“アプリらしい動き”になっています。

カウントダウン版トレーニングカウンター

残り回数だけを表示するスタイル

今度は、カウントダウンの形で
「残り回数だけ」を表示してみましょう。

total = 5

print("===== カウントダウントレーニング =====")
print()
print("これから", total, "回のトレーニングをします。")
print()

for remaining in range(total, 0, -1):
    print("残り", remaining, "回")
    if remaining == 1:
        print("ラスト！ 集中！")
    print()

print("終了！ よくがんばりました。")

total = 5

print("===== カウントダウントレーニング =====")
print()
print("これから", total, "回のトレーニングをします。")
print()

for remaining in range(total, 0, -1):
    print("残り", remaining, "回")
    if remaining == 1:
        print("ラスト！ 集中！")
    print()

print("終了！ よくがんばりました。")

出力はこんな感じです。

===== カウントダウントレーニング =====

これから 5 回のトレーニングをします。

残り 5 回

残り 4 回

残り 3 回

残り 2 回

残り 1 回
ラスト！ 集中！

終了！ よくがんばりました。

ここでは、

• remaining という変数名を使って、「残り回数」を直接表している
• range(total, 0, -1) で、5, 4, 3, 2, 1 と減らしている

という構造になっています。

「今何回目か」ではなく、
「残り何回か」を主役にしたカウンターです。

「設定ゾーン」「ループゾーン」「締めのゾーン」で見る

コードを3つのかたまりとして眺める

トレーニングカウンターのコードを、
ざっくり3つのゾーンに分けて見てみましょう。

設定ゾーン
（total などの値を決める）

ループゾーン
（for で回数ぶんの処理を繰り返す）

締めのゾーン
（最後のメッセージを出す）

例えば、さっきのカウントアップ版なら、

total = 5          # ← 設定ゾーン

print("===== トレーニングカウンター 5 日目 =====")
print()
print("全部で", total, "回やります。")
print()

for i in range(1, total + 1):   # ← ループゾーンの入口
    ...
    ...                         # ← ループの中身（1回分の処理）
    ...

print("おつかれさまでした！")   # ← 締めのゾーン

total = 5          # ← 設定ゾーン

print("===== トレーニングカウンター 5 日目 =====")
print()
print("全部で", total, "回やります。")
print()

for i in range(1, total + 1):   # ← ループゾーンの入口
    ...
    ...                         # ← ループの中身（1回分の処理）
    ...

print("おつかれさまでした！")   # ← 締めのゾーン

という構造になっています。

この「3つのゾーン」を意識できるようになると、

• どこを変えれば回数が変わるか
• どこを変えればメッセージが変わるか

が、すぐに分かるようになります。

5日目の仕上げ：自分用トレーニングカウンターを作る

total を変えるだけで使い回せる形にする

最後に、あなた自身の「自分用カウンター」を
1つ完成させてみましょう。

例として、こんな形にしてみます。

total = 8   # ← ここを変えれば回数を変えられる

print("===== 自分用トレーニングカウンター =====")
print()
print("今日の目標回数は", total, "回です。")
print()

for i in range(1, total + 1):
    print("▶", i, "回目")

    if i == 1:
        print("   ウォーミングアップ。無理せずいきましょう。")
    elif i < total:
        print("   いいペースです。続けていきましょう。")
        print("   残りは", total - i, "回です。")
    else:
        print("   ラスト！ 出し切ろう！")

    print()

print("おつかれさま。今日のノルマは達成です。")

total = 8   # ← ここを変えれば回数を変えられる

print("===== 自分用トレーニングカウンター =====")
print()
print("今日の目標回数は", total, "回です。")
print()

for i in range(1, total + 1):
    print("▶", i, "回目")

    if i == 1:
        print("   ウォーミングアップ。無理せずいきましょう。")
    elif i < total:
        print("   いいペースです。続けていきましょう。")
        print("   残りは", total - i, "回です。")
    else:
        print("   ラスト！ 出し切ろう！")

    print()

print("おつかれさま。今日のノルマは達成です。")

このコードは、

• total を変えるだけで、目標回数を変えられる
• 1回目、途中、最後でメッセージが変わる
• 「今」と「残り」を意識した構造になっている

という意味で、
かなり“アプリとしての形”が整っています。

5日目で特に深く理解してほしいこと

1つ目：「今」と「残り」を同時に扱う感覚

i（今何回目か）
total - i（残り何回か）

この2つをセットで考えられると、
カウンターとしての表現力が一気に上がります。

2つ目：設定を変えるだけでアプリの動きが変わる

total = 5
total = 10

のように、上のほうの設定だけ変えて、
下のループやメッセージはそのまま。

「設定ゾーン」と「ループゾーン」を分けて考える」
これは、プログラム設計の大事な感覚です。

3つ目：for ＋ if で「回数によってメッセージを変える」

1回目だけ特別
途中は励まし
最後はラストメッセージ

このパターンは、
トレーニングだけでなく、
ゲーム、学習、作業カウンターなど、
いろんな場面で使えます。

6日目へのつなぎ

5日目までであなたは、

• 「今」と「残り」を同時に扱える
• トレーニング風のカウンターを設計できる
• 設定を変えるだけで、アプリを使い回せる

というところまで来ました。

6日目からは、
このカウンターに「条件」や「スキップ」をもう少し足して、

• 特定の回だけ別の処理をする
• 何セットか繰り返すイメージを作る

といった、もう一段階“アプリ寄り”の形に近づけていきます。

最後にひとつ、あなたに聞きたい。

今日のトレーニングカウンターの中で、
「これ、実際に自分の何かに使えそうだな」と感じた部分はありましたか？

その「使えそう」という感覚が、
あなたと“繰り返しカウントアプリ”を本当に結びつけるポイントです。