web制作のしおり

日々の学習をアウトプットします。

79.クラスを定義してみよう ~わからない時は、すぐ手を動かしてみる~

昨日に引き続きクラスについて学習していきます。

 

クラスって何という方はこちら

manablo.hatenablog.jp

 

では、早速やっていきましょう。

 

PHPでクラスを定義する

まずはコードから

<?php 
     class TestClass {

       public $name;

    
       public function __construct($name){
           $this->name = $name;
       }
    }

 ?>

 

1行ずつ、確認していきましょう。

まずは

class TestClass { }

これは「クラスを定義しますよ」というキーワードですね。

この中に先日学習した、プロパティやメソッドを記述していくわけです。

また、TestClassの部分は任意に決められるクラス名です。

また、クラス名は最初を大文字で記述するというルールがあります。

今回は「TestClassを定義しますよ」という記述でした。

 

次に

public $name;

これは、「TestClassのプロパティには$name変数がある。」という意味です。

ちょっとわかりにくいですね。

クラスとインスタンスの関係で見ると、

TestClassの「プロパティ」は$name変数があって、「インスタンス」を作る時に$name変数に「データ」を入れて使うよ。

こんなイメージです。

publicについてもモヤッとするポイントですが、これは明日以降の学習に譲ります。

 

public function __construct($name){ }

これはインスタンス」を作ると同時に実行される処理です。

この処理の名前をコンストラクと言います。

また、わかりにくいですね。

クラスには、インスタンス作成時の初期設定に関する処理を書けるよ。

くらいのイメージで良いと思います。

インスタンス作成については明日以降の記事でまたやりたいと思います。

 

最後に

$this->name = $name;

これは割りと意味不明です。

ただ、JavaScriptでも出てきたthisキーワードとほぼ同じような意味なのかなと思います。

 

$thisクラスから作成されたインスタンス自身を指します。

インスタンスのプロパティ(データ)にアクセスしたいときには

$this->プロパティ名

とすればアクセスできます。

なのでここでは、「クラスから作成されたインスタンスのnameプロパティを取得」しているわけですね。

そして、コンストラクタの引数として指定していた$name変数の値をインスタンスのプロパティの$name代入しています。

 

ややこしい笑

 

まとめると?

クラスを定義するには、

classキーワードの括弧の中に

プロパティ、メソッドを記述する。

これだけのことなんですが、最初のコードの記述だけ見てもさっぱりでしたね。

おさらいに最初に見たコードを一般化しておきましょう。

     class クラス名{

       public $プロパティ名;

    
       public function __construct($引数名){
           $this->プロパティ名 = $引数名;
       }
    }

 

今日のまとめ

  • クラスはclassキーワードを使って定義する
  • プロパティとメソッドを中に記述する
  • インスタンス作成時に実行されるメソッドをコンストラクタと呼ぶ

明日も引き続きクラスについて学習しようと思います。

ここは力をいれて取り組むポイントだと直感が言っています笑

 

では、また。

78.クラスって何だろう? ~データと処理の塊~

昨日までとは変わって、概念的なものを学んでいきます。

 

オブジェクト指向言語には必ずついて回るらしい「クラス」について、やっていきましょう。

 

クラスとは

データと処理の塊を作る。

データのことをプロパティ

処理のことをメソッド

と呼びます。

 

複数のプロパティ、複数のメソッドを1つの塊として管理するのがクラス。

わかったような、わからないような…。

引き続き見ていきましょう。

 

クラスのまま使うことは稀

クラス自体は実はそのまま使うことは少なくて、

インスタンスという実体をクラスから生成して

インスタンスを使うというのが基本のようです。

 

調べていてよく目にする説明が、

クラスは設計図、インスタンスは設計図から作られた物

わかったような、わからないような…。

 

 

どんなメリットがあるのか?

ゲームのアイテムを例にしてみましょう。

今までの知識で複数のゲームのアイテム(武器)を作る場合を考えてみます。

まず、武器にはいろいろなパラメータがありますよね。

武器名、攻撃力、属性、種類、特殊効果

これらのパラメータを持った武器を作る場合、連想配列などを使うことになると思います。

例えば、

["武器名"=>"テストの剣",”攻撃力”=>10,”属性”=>"火",”種類”=>"剣",”特殊効果”=>1]

こんな感じの連想配列を作って、特殊効果は数値を引数にとって処理する関数を作って…。

さらに武器を作りたい場合は同じ様式で、連想配列を作って…。

["武器名"=>"テストの斧",”攻撃力”=>15,”属性”=>"水",”種類”=>"斧",”特殊効果”=>2]

武器のリストにするから、さらにこの武器の連想配列連想配列にして…。

["テストの剣"=>

["武器名"=>"テストの剣",”攻撃力”=>10,”属性”=>"火",”種類”=>"剣",”特殊効果”=>1],

"テストの斧"=>

["武器名"=>"テストの斧",”攻撃力”=>15,”属性”=>"水",”種類”=>"斧",”特殊効果”=>2]]

…。

 

キリがないですよね。

これがクラスを使うと楽になるということなのです。

なぜなら、データと処理をまとめて、そこからインスタンスという実体を作れるから。

???

先程の例の武器で考えると

「武器のパラメータのテンプレートを作って、用意された箇所に必要な値いれるだけ」

こんなイメージです。

 

クラスとインスタンスのざっくりとした理解

自分は以下のようにイメージしています

ーーーー武器クラスーーーー

武器名:X

攻撃力:X

属性:X

種類:X

特殊効果:Y

ーーーーーーーーーーーーー

青色・・・データ

橙色・・・処理

こんな感じのテンプレート的なものを定義したのがクラス

 

データや処理に対して個別に値を設定して、1つの個体化したものがインスタンス

 

おそらくこういうことが言いたいのでは無いかと…。

 

今日のまとめ

  • クラスはデータと処理をまとめたテンプレートのようなもの
  • インスタンスはテンプレートを使って作った1つのもの

 

抽象的な説明が多くてイマイチですが、ゲームを例にしたらなんだか掴めた気がします。

実際に使ってみて、どうか。

ですね。

 

では、また。

77.if文でHTMLの表示を切り替えよう! ~受け取ったデータで条件分岐~

昨日はフォームのデータ送受信について、ざっくりとした仕組みを確認しました。

action属性、name属性がいい味を出していましたね。

 

今回は「条件に基づいてHTMLの表示を切り替える。」

これをやっていきたいと思います。

 

if分の基本はこちらの記事でやっています。

manablo.hatenablog.jp

 

ifで表示を切り替えるには?

if文を使ってHTMLの表示を切り替えるには

通常の書式とは少し異なる書き方が必要です。

とは言え、先日やったforeachとほぼ同じです。

 

<div class="php-test">

<?php if(条件): ?>

~HTML~

<?php endif; ?>

</div>

 

切り替えをしたいHTMLをphpタグ(if文)で囲ってあげるだけです。

<?php if(条件): ?>

この意味は、

条件が正しい時にendifタグまでの間を処理または、出力する

こんなイメージで良いと思います。

 

条件を指定して切り替える

まずは仮のコードから

 

<div class="php-test">

<?php if($_POST["number"] >= 1):  ?>

<h2>テストタイトル</h2>

<p>これは<?php echo $_POST["number"];>番目のテスト文です</p>

<?php endif; ?>

<?php if($_POST["number"] < 1):  ?>

<h2>nontitle</h2>

<p>これは番号が1より小さいテスト文です</p>

<?php endif; ?>

</div>

 

1つ目のphpのifブロックでは、

フォームから受け取った連想配列のキー「number」の中身が1以上の場合、

h2のタイトル文と、pタグがHTMLテキストとして出力されます。

仮にフォームから受け取ったnumberの中身が1未満なら表示されません。

2つ目のphpのifブロックでは、連想配列のキー「number」の中身が1未満の場合に出力されます。

 

因みにフォームデータの送受信については下記記事を参考ください。

manablo.hatenablog.jp

 

どちらかのブロックが出力される為、

ブラウザが受け取るHTMLの構造としては、

<div class="php-test">

<h2>~分岐後の値が入ります~</h2>

<p>~分岐後の値が入ります~</p>

</div>

必ずこの形になるというわけですね。

これで「受け取る値によって、表示するコンテンツを切り替える」ことができました。

 

今日のまとめ

  • 条件式でHTMLの表示を切り替えるにはforeachのときのようなコロンを使ったphpのifタグ、endifタグで囲む
  • 条件式が成立しない場合は出力されない

フォームから受け取った値によってページ内容を切り替えることができるようになりました。

ガシガシ書いて、できたものを表示するだけだったWebページが、ユーザーの入力によって変化するの面白いですね。

 

では、また。

76.Formを使ってデータを受け渡そう! ~HTMLでの疑問部分がようやく明らかに~

HTMLでフォームを作っていた時に、このデータは「どうやってやりとりするのかなぁ」という疑問をぼんやり持っていました。

 

今日、遂にその疑問が解消されます。

 

では早速やっていきましょう。

 

formデータの送受信

<form action="example.com" method="post">

HTMLの学習中に、このような記述を見たことがある方は多いのでは無いかと思います。

でもactionが何で、methodが何のような説明は割りとスルーされがちかなぁと感じました。

私自身ひとまず、HTMLを書けるようになるのに必死で、これが「内部的にどういったことをしているのか」なんて言うところまでは頭が回っていないのです。

 

ようやくそれを学習できる段階に来たんだなぁと勝手にしみじみとしています。

 

actionでデータ送信先を指定

これは、form内のデータを送信する先を指定します。

今回はPHPファイルを指定してみましょう。

<form action="contact.php" method="post">

これで、このフォームのデータはpayment.phpに渡すよということがブラウザ伝わるわけですね。

 

methodとは

methodは送信する手段の事です。

GETPOSTとという2種類があります。

GETはURLにデータ、パラメータなどが含まれて送信されるという点でPOSTとは異なります。

今回はPOSTについて確認していきましょう。

 

ファイル名index.php

 

<form action="contact.php" method="post">

<input type = “text” name ="message“>
<input type = “submit” value =“送信“>

</form>

 

こんな感じのコードで確認していきましょう。

 

送信側の処理の流れを確認

この状態でtype="submit"の送信ボタンを押すとフォーム内の値がaction属性に指定した先へと送信されます。

その時の送信手段としてmethodで指定した方法で送信されます。

今回はPOSTですね。

 

受信側の処理の流れを確認

受信側でデータを使う場合は、$_POSTというPHPで定義済みの連想配列を使用します。

この$_POSTには送信側からinputのname属性をキーとして、対応するフォームの内容が

紐づけられて格納されています。

ここまで自動でやってくれるのすごいですね。

 

ですので、例えば先ほどのコードだと

<body>

<h2>テスト</h2>

<p><?php echo $_POST["message"]; ?></p>

</body>

このようにすることで、index.phpのテキスト欄に入力された値をcontact.phpで受け取り、連想配列のキーにname属性のmessageを指定して、内容をpタグ内に表示する。

ことができます。

 

こうした流れでデータの受け渡しが行われていたんですね。

 

今日のまとめ

  • formでデータを送信する先はaction属性で指定する
  • 送信手段はGETとPOSTの2種類がある
  • POSTは受信側では既定の連想配列に、ルールに基づいてキーとバリューとして使うことができる

 

ページ間のデータのやりとりができるのは面白いですね。

HTMLやJavaScriptにはなかったですよね。

 

では、また。

75.PHPファイルを分割してみよう ~意外と楽に管理ができる~

PHPファイルにはHTMLを記述したり、配列を書いたり、HTMLの中に文字列を埋め込んだり用途が様々ですよね。

 

今回は用途別にPHPを分割することで、目的別にPHPを作成し管理したいと思います。

 

配列だけのPHPファイルを作る

難しいことはなく、単純にPHPファイルを新規作成して、いつものルールで記述するだけですね。

 

せっかくのなので、配列の中に配列をいれてデータを管理することもやっていみましょう。

 

<?php 
$corps =[

 ["name"=>"google",”ip"=>"192.168.1.1"],

["name"=>"apple",”ip"=>"192.168.1.2"],

["name"=>"facebook",”ip"=>"192.168.1.3"],

["name"=>"amazon",”ip"=>"192.168.1.4"],

["name"=>"microsoft",”ip"=>"192.168.1.5"]

];

?>

 

上記コードをcorplist.phpに記述します。

 

PHPファイルに別のPHPファイルに読み込む

分割したPHPを読み込みます。これは特に難しいことはなくて、

メインのPHPファイルにPHPファイルを読み込む記述をするだけで完了です。

 

<?php require_once "corplist.php"?>

 

これだけで、読み込み完了です。

で、読み込んでどうやって使うのかを次に見ていきましょう。

 

読み込んだPHPを利用する

これも難しいことは無いです。

Sassのときにはファイル名を書いて、ドットを書いて、変数名を書いて…

のように利用までに必要な記述が多かったですね。

ただ、phpの場合はそうした名前を定義する必要はなく、

先程の例で言えば、

 

index.phpの中に下記のように記述します。

 

<?php require_once "corplist.php"?>

<head>

~~

</head>

<body>

~~

<?php foreach($corplist as $corp): ?>

<div class="card">
    <h2 class="corporate-name"><?php $corp[name]; ?></h2>
    <p>これは会社紹介です</p>
</div>
<?php endforeach; ?>

~~

</body>

 

みたいに書くだけで、corplist.phpから読み込んだ配列をindex.phpで特別な手順をふまずに使用できます。

 

非常に便利ですね。

 

今日のまとめ

  • phpファイルは分割して読み込むことができる
  • 分割の仕方によっては、ファイルごとに役割をもたせることができるので、管理が楽になる。
  • 分割したPHPを読み込んだ場合でも特別な手順を必要とせず、通常の変数や配列のアクセス方法で良いので、分割後の手間に変化はほぼ無い。

 

ファイルの分割はCSSクラス設計に近いものを感じました。

役割を持たせて、メンテナンス性を持たせて管理したいなと考えています。

 

では、また。

74.foreachでHTMLのブロックをまとめて書く ~PHPで楽して書こう~

foreachを使ってHTML要素の繰り返し記述が楽になる。

結構な衝撃でした。

本日はこれをやっていきましょう。

 

どんなところに使うのか

カードとかアイテムとかニュースとか

形は同じで中身が違うような

そんなところで大いに力を発揮してくれます。

 

例えば、phpの配列に表示したい要素の中身をストックしておいて、

配列の中身の分だけHTMLの要素を生成して表示させたい。

そんなことができちゃうのです。

 

まずは配列とベースとなるHTMLを用意する

今回は処理を確認するだけなので、簡素なもので進めていきます。

まずはPHPの配列

<?php 
$names =[ "google" , "apple" , "facebook" , "amazon" , "microsoft"];
?>

 

次にHTML

<div class="card">
    <h2 class="corporate-name"></h2>
    <p>これは会社紹介です</p>
</div>

 

上記の配列とHTMLを使って、カードをブロック単位で生成していきましょう。

 

繰り返したいHTML部分をforeachで囲む

通常のforeachと書き方が違って、

 

<?php foreach($names  as $name): ?>
<div class="card">
    <h2 class="corporate-name"></h2>
    <p>これは会社紹介です</p>
</div>
<?php endforeach; ?>

 

このように繰り返したいHTMLをphpタグでサンドイッチします。

特に注意したいのは、開始側のPHPの部分で

foreach($names  as $name):

最後がセミコロンではなくコロンなので、間違えないようにしましょう。

 

配列から取出したデータをHTMLに表示させる

下記のように記述することで、配列から取出したname変数がh2タグのコンテンツとして表示されます。


<?php foreach($names  as $name): ?>
<div class="card">
    <h2 class="corporate-name"><?php echo $name; ?></h2>
    <p>これは会社紹介です</p>
</div>
<?php endforeach; ?>

 

これで、phpプログラムで処理されたHTMLは$names配列に格納されているデータの分だけ、上記のブロックが生成された状態で表示されるのです。

すごい!

 

ブラウザが受け取る時は上記コードが、

 

<div class="card">
    <h2 class="corporate-name">google</h2>
    <p>これは会社紹介です</p>
</div>

<div class="card">
    <h2 class="corporate-name">apple</h2>
    <p>これは会社紹介です</p>
</div>

<div class="card">
    <h2 class="corporate-name">facebook</h2>
    <p>これは会社紹介です</p>
</div>

<div class="card">
    <h2 class="corporate-name">amazon</h2>
    <p>これは会社紹介です</p>
</div>

<div class="card">
    <h2 class="corporate-name">microsoft</h2>
    <p>これは会社紹介です</p>
</div>

 

このようにして表示されてくるのです。

コード量が段違いですよね。

 

今日のまとめ

  • foreachを使うことで、配列の中身の数だけブロックを自動生成してブラウザにわたすことができる。
  • foreachの書き方が通常とは若干異なるので、記述に注意する

 

こんなに簡単にページが生成されてしまうの、すごいですね。

手書きでゴリゴリと書いているのが少し虚しくなりました笑

 

引き続き楽しんでPHP進めていきたいと思います。

 

では、また。

73.PHPで書いてみよう ~PHPファイルにHTMLと併せて書く~

素朴な疑問なんですが、PHPファイルにやたら<?php ?>って書いてると思います。

そこれと同時にHTMLを大量に書いてもページが正しく表示されるのは何故?

 

ということで、今日もやっていきましょう。

 

PHPとHTMLの混在したPHPファイル

サーバーで、どうやってこのPHPファイルが処理されているかがイマイチわかっていないです。

ということで調べてみました。

ざっくりのイメージですが登場人物は3人

  1. ブラウザ
  2. サーバー
  3. PHPプログラム

流れを見ていきます。例えば、

 

ブラウザに、http://www.test.com/index.phpのURLを入力すると

http://www.test.com/のサーバーに対して通信を開始

サーバーはindex.phpを実行、PHPプログラムが実行され処理が始まる。

 

PHPプログラムは<?php … ?>で囲まれた内側はルールに基づいて適切に処理、外側に書かれた文字はすべてそのままで、処理が終わると、すべてテキストの状態でサーバーに渡されます。

 

サーバーは受け取ったテキストを要求があったブラウザに返します。

ブラウザはHTMLを解釈して表示するので、PHPプログラムからサーバーに渡された時点のテキストが「正しいHTML」で書かれたテキストになっていれば、Webページとして表示されるわけですね。

 

実際に書いてみる

HTMLをPHPを使って一部を書いてみましょう。

まずはベースとなるHTMLから

 

<body>

<h1>これはテスト</h1>

<img src="./image/test.png">

<p>ここは画像の名前</p>

</body>

 

これをPHP連想配列を使って書いてみます。

 

PHPを使うと

<?php

$image = ["src" =>"./image/test.png", "text"=>"ここは画像の名前"];

?>

<body>

<h1>これはテスト</h1>

<img src="<?php echo $image["src"];?>">

<p><?php echo $image["text"];?></p>

</body>

 

こんな形で、タグの中にPHPプログラムを書き込むこめば、サーバーに渡す前には処理されてHTMLになっているというわけです。

 

上のコードでは、PHPで書いた方がコードが長くなってしまっていますが、

これが仮にCARDとかをPHPの配列とforeachを使って書いたりしたら、

めちゃめちゃコードの量減ると思いませんか?

 

面白くなってきた、PHP

 

今日のまとめ

  • PHPプログラムは処理が終わるとテキストをサーバーに渡す
  • サーバーは受け取ったテキストをブラウザに返す
  • 正しいHTMLならWebページが表示される。
  • PHPを使って「書き方」を工夫するとぐっと楽になる。
  • サーバー側で処理した後のテキストがかえってくるので、動的にページを変えることも可能

 

PHPまだまだ始まったばかりですね。

これからいろいろな書き方、使い方を学んでいくのが楽しみになりました。

 

では、また。