この記事にはプロモーションが含まれています。

【PHP】for文を書くときの考え方｜tableを使った九九表作成

2024-05-082024-06-12

ケケンタ

PHPを勉強し始めたけどfor文でつまずいてる……
どう考えてプログラムを組んで良いかイメージできない……

今回はこのようなお悩みをお持ちの方に向けて

九九表作成で学ぶ、for文を書くときの考え方

を解説していきます。

この記事が向いている方

PHPのfor文の書き方のイメージが掴み切れない方
PHPを学習し始めたばかりの方
PHPで九九表を作成したい方
二重ループを理解したい方

for文はプログラミング初心者の方にとって鬼門のひとつと言われています。

if文までは順調と思っていたのに、for文でつまずいてしまったという方も多いのではないでしょうか。

ケケンタ

この記事をご覧いただくことで、どんな手順で考えていけばfor文を上手く組むことができるのかが分かります。

PHPのことを体系的に学びたい方にはこちらの書籍がおすすめです。
（僕自身が初めてPHPを学ぶとき実際に使用した本です）

PHP本格入門[上] ~プログラミングとオブジェクト指向の基礎からデータベース連携まで
大塚正登／著　技術評論社／出版｜Amazon

＼Web制作を仕事にしたいなら／

まずは無料相談してみる >>

￣￣￣

格安レンタルサーバーを
お探しなら

格安サーバーをお探しならリトルサーバーがおすすめ！

リトルサーバーの特徴

月額150円～利用可能
標準で全サーバー毎日自動バックアップ付き
全プランWordPress対応（簡単インストール機能付き）
独自SSLが無料（全プランがSSLに完全対応）
提供ドメインが複数あるため独自ドメインが無くても複数サイト運営可能
独自ドメイン無制限（サブドメインも無制限で利用可能）
無料お試し期間がある

リトルサーバーの最大の特徴は安価な月額料金です

＼利用料金比較表／

	ミニプラン	ワードプラン	リトルプラン	ビッグプラン
月額料金	150円～	195円～	250円～	430円～
SSD容量	20GB	30GB	60GB	120GB
提供ドメイン	アカウント＋２	アカウント＋２	アカウント＋３	アカウント＋５
独自ドメイン	無制限
バックアップ	７日分

＜リトルサーバー＞プラン別サービス比較

有名なサーバーだと月額料金は1000円前後であることが普通です。

仮にリトルサーバーで同じ料金（1000円）を支払ったとすると

最も安いミニプランだと半年分、
おすすめのリトルプランでも４カ月分のサーバーがレンタル可能！

こんな方にオススメ

実案件でテスト用のサーバーを用意したい
とりあえずサーバーというものに触れてみたい
試しにWordPressを本番運用してみたい
いま利用しているサーバーが高額だから安価なレンタルサーバーに乗り換えたい

ケケンタ

リトルサーバーには無料お試し期間があります。
ご興味のある方は是非ご検討してみてはいかがでしょうか。

＼無料お試しのお申し込みはこちら／

月額150円からWordPress対応のリトルサーバー

「仕事が忙しい方」、「すぐに商品が欲しい方」にピッタリのサービス

Amazon Prime

by Amazon

日時指定便が「無料」で使えるので不在で商品を受け取れないという心配が無くなる

最短で注文した「翌日」に商品が届くので欲しいものがすぐ手に入る　
※ご注文の時間帯やお住まいの地域によります。

Amazonプライムの無料体験は「何度でも」利用可能

Amazonプライムの無料体験を何度も利用する方法

Amazonプライムに会員登録する
会員の自動更新を解除しておく＝期限が来たら自動解約
１～３ヶ月ぐらいすると再度無料体験の案内が表示される

ケケンタ

僕自身、過去に少なくとも３回は無料体験を利用しています。

Amazonプライムの無料体験を試してみる　>>

PHPにおけるfor文とは？

実際に解説をする前に、念のためfor文とは何か？について簡単にお話をします。

for文とは？

for文とは、ある処理を繰り返し行いたいときに用いるPHPの基本構文のひとつです。
似た構文としてwhile文があります。

具体例

<?php
    /**
     * 0～9までの数字を繰り返し出力する
     */
    for($i=0; $i<10; $i++){
        echo $i;
    }

    /**
     * for文を使用しないで書こうとすると……
     */
    echo 0;
    echo 1;
    echo 2;
    echo 3;
    echo 4;
    echo 5;
    echo 6;
    echo 7;
    echo 8;
    echo 9;

    // 出力結果はいずれも以下のようになる
    // 0123456789
?>

ケケンタ

このように、for文を用いることで、より短いプログラムで処理を組むことが可能です。

以下の記事ではピラミッド作成を通してfor文を書くときの考え方を解説しています。
ご興味のある方はぜひご覧ください。

九九表作成を通じてfor文書くときの考え方を学ぶ

for文だけに言えることではありませんが、プログラムを組むときには、考え方にちょっとしたコツがあります。

それは、一気に処理を考えようとするのではなく、課題を分解して小さな処理を書いていき、最終的に大きな処理に組み上げるということです。

これがプログラミングでは論理的思考が重要といわれるゆえんです。

しかしそうは言っても、初心者の方がいきなりこのように処理を書ければ苦労はしません。

ケケンタ

かくいう僕もプログラミングを学び始めたばかりの頃は中々処理が書けるようにならずとても苦労しました……

この記事では、九九表作成を通じて上記のような流れを実際に体験していただける構成になっています。

その中で少しでもプログラミングで処理を組むときの考え方・流れのイメージを掴んでいただければと考えています。

ケケンタ

それでは、以下より実際に九九表を作成しながら、どのようにしてfor文を組んでいけば良いのかを解説していきます。

【実践解説】九九表作成

今回作成する九九表の最終的な出力結果

九九表プログラム（完成形）

<table class="kuku-tb">
    <tr>
        <th> </th>
        <th>1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
        <th>5</th>
        <th>6</th>
        <th>7</th>
        <th>8</th>
        <th>9</th>
    </tr>
    <?php 
        for($i=1; $i<=9; $i++){
            echo '<tr>';
            for($j=1; $j<=9; $j++) {
                if($j==1){
                    echo '<th>' . $i . '</th>';
                }
                echo '<td>' . $j*$i . '</td>';
            }
            echo '</tr>';
        }
    ?>
</table>

この記事で作成する九九表はCSSで装飾をしています。
同じ見た目にしたい方は以下のCSSをコピペしてお使いください。

九九表のCSS

<style>
    .kuku-tb {
        border: 1px solid;
        border-collapse: collapse;
    }
    .kuku-tb th,
    .kuku-tb td {
        padding: 5px;
    }
    .kuku-tb th {
        border-right: 1px solid #fff;
        border-bottom: 1px solid #fff;
        background-color: #bbb;
        width: 30px;
    }
    .kuku-tb tr:first-child th{
        border-bottom: none;
    }
    .kuku-tb tr:first-child th:first-child {
        border-bottom: 1px solid #fff;
    }
    .kuku-tb tr:first-child th:last-child {
        border-right: none;
    }
    .kuku-tb tr:last-child th {
        border-bottom: none;
    }
    .kuku-tb td {
        text-align: center;
    }
    p {
        font-weight: bold;
    }
</style>

九九表作成の流れ

まずはハードコーディング（手打ち）で九九表を作成する
行（trタグ）だけをfor文で作成する
行（trタグ）の中の各列をfor文で作成する＝二重ループの構築
最後に各行（trタグ）の先頭にthタグを付ける＝見出し列の作成

①まずはハードコーディング（手打ち）で九九表を作成する

慣れてくるまでの間は、for文を組むときは出力結果をとりあえずハードコーディング（手打ち）してみるのがポイントです。

具体的に書くと以下の通りです。

※長くなるため４の段以降は省略します

// 九九表をハードコーディングする
<table class="kuku-tb">
    <tr>
        <th> </th>
        <th>1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
        <th>5</th>
        <th>6</th>
        <th>7</th>
        <th>8</th>
        <th>9</th>
    </tr>
    <!-- 1の段 -->
    <tr>
        <th>1</th>
        <td>1</td>
        <td>2</td>
        <td>3</td>
        <td>4</td>
        <td>5</td>
        <td>6</td>
        <td>7</td>
        <td>8</td>
        <td>9</td>
    </tr>
    <!-- 2の段 -->
    <tr>
        <th>2</th>
        <td>2</td>
        <td>4</td>
        <td>6</td>
        <td>8</td>
        <td>10</td>
        <td>12</td>
        <td>14</td>
        <td>16</td>
        <td>18</td>
    </tr>
    <!-- 3の段 -->
    <tr>
        <th>3</th>
        <td>3</td>
        <td>6</td>
        <td>9</td>
        <td>12</td>
        <td>15</td>
        <td>18</td>
        <td>21</td>
        <td>24</td>
        <td>27</td>
    </tr>

    <!-- 4の段以降はいったん省略 -->

</table>

出力結果

最初にハードコーディングをする目的は、こうすることでどの部分が繰り返し処理に置き換えられるかが視覚的にイメージしやすくなるためです。

例えば今回の九九表では、trタグやその中のthタグ、tdタグの部分が繰り返されており、「ここをfor文で書き換えられそうだな」とあたりが付けやすくなります。

これにより、頭のリソースに余裕が生まれ、処理をイメージしやすくなります。

②行（trタグ）だけをfor文で作成する

次も一気に処理を書くのではなく、まずは大枠である行（trタグ）の部分をfor文に置き換えてみます。

<table class="kuku-tb">
    <tr>
        <th> </th>
        <th>1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
        <th>5</th>
        <th>6</th>
        <th>7</th>
        <th>8</th>
        <th>9</th>
    </tr>
    <?php 
        // １～９の段までのtrをとりあえずループで出力
        for($i=1; $i<=9; $i++){
            echo '<tr>';
            echo '<td>' . $i . '</td>';
            echo '</tr>';
        }
    ?>
</table>

出力結果

この段階では明らかに求めている結果とは違う出力になっていますが、行（trタグ）をfor文で出力できたという点に着目してみましょう。
このあとさらに足りない部分を追加して処理を補っていきます。

③行（trタグ）の中の各列をfor文で作成する＝二重ループの構築

次に、②で出力した行（trタグ）の中に各列の値＝九九の計算結果を出力するようにプログラムを追記・修正していきます。

<table class="kuku-tb">
    <tr>
        <th> </th>
        <th>1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
        <th>5</th>
        <th>6</th>
        <th>7</th>
        <th>8</th>
        <th>9</th>
    </tr>
    <?php 
        for($i=1; $i<=9; $i++){
            echo '<tr>';
            // ***** この部分を追記・修正 *****
            /**
             * i行目のj列目を計算
             */
            for($j=1; $j<=9; $j++) {
                echo '<td>' . $i * $j . '</td>';
            }
            // ******************************
            echo '</tr>';
        }
    ?>
</table>

出力結果

ケケンタ

ここまで来ると、いよいよ九九表らしくなってきましたね！

この段階ではfor文内にさらにfor文を組み込む二重ループになっているため、もしかしたらイメージが湧かないという方も多いかもしれません。

ここで行っていることは、以下のような単純な計算です。

【iの段（i行目）】i×j列目
————————————
【1の段（1行目）】1×1=1、1×2＝2、1×3＝3、1×4＝4……
【2の段（2行目）】2×1=2、2×2＝4、2×3＝6、2×4＝8……

④最後に各行（trタグ）の先頭にthタグを付ける＝見出し列の作成

最後に、各行（trタグ）の先頭のthタグが抜けており九九表全体が左に１マスずれてしまっているため、各行の先頭列にのみthタグを出力するように修正します。

<table class="kuku-tb">
    <tr>
        <th> </th>
        <th>1</th>
        <th>2</th>
        <th>3</th>
        <th>4</th>
        <th>5</th>
        <th>6</th>
        <th>7</th>
        <th>8</th>
        <th>9</th>
    </tr>
    <?php 
        for($i=1; $i<=9; $i++){
            echo '<tr>';
            for($j=1; $j<=9; $j++) {
                // ***** ここを追加 *****
                /**
                 * 各行の先頭列にのみthタグを出力
                 */
                if($j==1){
                    echo '<th>' . $i . '</th>';
                }
                // *********************
                echo '<td>' . $j*$i . '</td>';
            }
            echo '</tr>';
        }
    ?>
</table>

出力結果