はじめに

私がエンジニアとしてキャリアをスタートさせた時に行った演習課題とその解き方を記述します。
エンジニアとなった最初はHTMLとPHPから勉強を始めました。
昨今ではPHP言語が使われることは少なくなってきましたが、保守などに使うことがあること、プログラミングとはどういうものかを理解するのにコストが少ないことから、初めて触る言語としてオススメだと思います。　
私は最初の2ヶ月くらいはPHPを触り、それからGO言語やTypeScriptなどの静的言語の学習を始めました。

本稿では、お馴染みではありますが、繰り返し処理と配列について学んでいきましょう。　
PHPの繰り返し処理だけでは、面白くないので最後にGO言語を使って同じ繰り返し処理と配列を作成します。

準備

PHPの実行環境を準備しましょう。
今回の演習では、webページに九九を表示させることをゴールとします。

~~以下の記事を参考に環境を構築してください。~~
実行環境の記事は別途公開予定です。

課題

課題は以下の順番で進めていきます。

1の段を縦に表示
1の段を横に表示
1の段から9の段までを縦に表示
九九の表を表示
別解を作ってみよう

1. 1の段を縦に表示

以下の完成形を目指します。

まずは、for文を用いて配列に1の段を格納していきます。
ここではわかりやすく配列の添字（key）は1から始めています。

$array = [];

for ($i = 1; $i < 10; $i++) {
    $array[$i] = "1 × " . $i;
}

配列が完成したら、続いてHTMLで表示してみましょう。
ここで注意が必要なのは、tableタグの使い方です。
<tr>で囲うと改行されるということと、各データを<td>タグで囲う必要があることです。
さらに、PHPとHTMLで記載する部分が分かれていると可読性が向上します。

<table border="1">
    <?php for ($i = 1; $i <= count($array); $i++) : ?>
        <tr>
            <td>
                <?php echo $array[$i]; ?>
            </td>
        </tr>
    <?php endfor ?>
</table>

2. 1の段を横に表示

続いては以下の形を書いてみましょう。

配列は先ほどと同じものを利用します。

<table border="1">
    <tr>
        <?php for ($i = 1; $i <= count($array); $i++) : ?>
            <td>
                <?php echo $array[$i]; ?>
            </td>
        <?php endfor ?>
    </tr>
</table>

違いが分かりましたか？
<tr>タグをfor文の外側に記述しました。

HTMLの書き方を少し工夫するだけでできました。

3. 1の段から9の段までを縦に表示

縦長でスクリーンショットは準備できませんでしたが・・・
まずは配列に1の段から9の段を格納してみましょう。
少しややこしいですが、for文を2回使うことで簡単に作成できます。

$array = [];
for ($j = 1; $j < 10; $j++) {
  for ($i = 1; $i < 10; $i++) {
    $array[$j][$i] = $j . " × " . $i;
  }
}

これで$j × $iが配列に格納されました。
それではこの配列をHTMLで描写してみます。
配列を作成した時と同様に、for文を2回使って描写します。

<table border="1">
    <?php for ($j = 1; $j <= count($array); $j++) : ?>
        <?php for ($i = 1; $i <= count($array); $i++) : ?>
            <tr>
                <td>
                    <?php echo $array[$j][$i]; ?>
                </td>
            </tr>
        <?php endfor ?>
    <?php endfor ?>
</table>

4. 九九の表を表示

以下の表を作っていきます。

配列は3で作ったものと同じものを使います。

ここで注意が必要なのは、1の段、2の段と描写していくのではなく、
<tr> <td>1 × 1</td> <td>2 × 1</td>・・・ <td>9 × 1</td> </tr>と記載する必要があることです。

<table border="1">
    <?php for ($i = 1; $i <= count($array); $i++) : ?>
        <tr>
            <?php for ($j = 1; $j <= count($array); $j++) : ?>
                <td>
                    <?php echo $array[$j][$i]; ?>
                </td>
            <?php endfor ?>
        </tr>
    <?php endfor ?>
</table>

5.別解を作ってみよう

1〜4まではいかがだったでしょうか。
配列と繰り返し処理はプログラミングで必須となるので、1〜4がすぐにできるようにトレーニングしましょう。
さらにここでは、上記の別解をいくつか提案してみます。

九九の配列をfor文を1つで作成してみましょう
九九の配列をforeachを使って表示してみましょう

他にも皆さんが、この処理ってこのやり方でも書けるのかな？と思ったらぜひ書いてみましょう！

GO言語での九九表の作成

PHPで作成した九九の表をGO言語でも作成してみようと思います。
PHPのようにHTMLと同時に書くことはできないので、コンソールで表示させてみましょう。
まずは、配列に九九の表を格納します。

package main

import "fmt"

var slice [][]string

func makeMultiple() {
	slice = make([][]string, 9)
	for j := 0; j < 9; j++ {
		slice[j] = make([]string, 9)
		for i := 0; i < 9; i++ {
			slice[j][i] = fmt.Sprintf("%v × %v", j+1, i+1)
		}
	}
}

func main()でsliceを取得できるようにグローバルの変数としてsliceを定義しています。
また、makeMultiple()関数で九九をスライスに格納するためにスライスのcapacityとlengthを初期化する必要があります。
またsliceは二次元のスライスなので、for文の中でslice[j]の初期化も行なっています。
これらの初期化を実行しないとエラーとなって動作しません。

続いて格納した九九をコンソールで表示していきます。

func main() {
	makeMultiple()
	for i := 0; i < 9; i++ {
		for j := 0; j < 9; j++ {
			fmt.Printf("%v ", slice[j][i])
		}
		fmt.Println()
	}
}

sliceはグローバルで定義しているのでmain()関数の中でmakeMultiple()関数を実行しsliceに九九を格納します。
続いて格納したsliceをfor文による繰り返し処理とfmt.Printf()を用いて出力しています。
fmtパッケージのPrint関数は、printf()では改行されないので、jが9回繰り返された段階で、fmt.Println()を実行して改行を行なっています。

実行結果は以下のとおりとなりました。

続いて同様の処理をfor rangeを使って出力してみます。

package main

import "fmt"

var slice [][]string
var changedSlice [][]string

func makeMultiple() {
	slice = make([][]string, 9)
	for j := 0; j < 9; j++ {
		slice[j] = make([]string, 9)
		for i := 0; i < 9; i++ {
			slice[j][i] = fmt.Sprintf("%v × %v", j+1, i+1)
		}
	}
}

func main() {
	makeMultiple()
	changedSlice = make([][]string, 9)
	for i := 0; i < 9; i++ {
		changedSlice[i] = make([]string, 9)
		for j := 0; j < 9; j++ {
			changedSlice[i][j] = slice[j][i]
		}
	}
	for _, row := range changedSlice {
		for _, val := range row {
			fmt.Printf("%v ", val)
		}
		fmt.Println()
	}
}

先ほど作成したmakeMultiple()関数で格納された九九をそのまま出力すると縦横が反対になってしまいます。
そのため、今回はmakeMultiple()関数を書き直すのではなく、sliceの縦と横を変換したchangedSliceを作成し、for rangeを使って出力を行いました。

余談

プログラミングの学習を進めていくと、パソコンを汚さないため言語のインストールはしない方が良い。
という意見をよく聞くようになると思います。
この記事を執筆するにあたり、自宅のパソコンを使っていますがPHPの実行環境を構築すると多くのパッケージをインストールすることとなってしまうため、DockerDevContainerを利用した実行環境を構築しました。
DockerDevContainerの環境構築にあたり、以下の記事がとても参考になりました。
ご興味のある方は以下の記事を参考に環境構築してみてはいかがでしょう！

エンジニア初学者のころの勉強方法について