今回はJavascriptのクラスを学ぶッピよ～！
クラスって？？
クラスとは、リストの配列に名前をつけてデータを取り出しやすくしたものッピ！
クラスの使い方を覚えれば、プログラミングがとってもラクになるッピ！
おお～！そりゃすげーな！
JavaScript入門｜クラスついて学ぼう
クラスの書き方
- メモ帳
が必要になるッピ！
まずクラスをどんなふうに使うかざっくりコードを見るッピ！
元になるコード
<script>
class seiseki{ //seisekiというクラスを作りますという宣言
constructor(namae,sugaku,kokugo) { //どんな風にクラス分けするのか？
this.namae = namae;//名前を記録します
this.sugaku = sugaku;//数学
this.kokugo = kokugo;//国語
}
}
let minnano_seiseki = [];//みんなの成績まとめ
minnano_seiseki[0] = new seiseki("田中",70,65);//[0]番.田中さん,数学70点,国語65点
minnano_seiseki[1] = new seiseki("佐藤",90,45);//[1]番.佐藤さん,数学90点,国語45点
document.write(minnano_seiseki[0].namae);//みんなの成績[0]番の名前を表示してください
</script>
お、田中って出たぞ！
これは、
document.write(minnano_seiseki[0].namae); で
minnano_seiseki[0]…
つまり、リストの[0]番.田中さん,数学70点,国語65点というデータの名前の部分だけを取り出したからッピ！
ちなみに、minnano_seiseki[0].namaeのnamaeを、
sugakuにすると、数学の点数が出てくるッピ！
おお！ ７０点になった！
どうしてこんなふうなことができるのか、詳しく解説するッピよ～
クラスの宣言とコンストラクタの書き方
クラスを使うには、クラス宣言とコンストラクタ（どんなふうに名前をつけてデータを保存するか）を設定できます。
クラスを宣言するには
class seiseki{
} と入力します。 seisekiの部分は変更可能です。
コンストラクタを設定するには、クラス宣言の中に設定を入力してあげる必要があります。
class seiseki{ //seisekiというクラスを作りますという宣言
constructor(namae,sugaku,kokugo) { //どんな風にクラス分けするか？
this.namae = namae;//名前を記録します
this.sugaku = sugaku;//数学
this.kokugo = kokugo;//国語
}
}このnamae,sugaku,kokugoは好きな名前を入力することができます。
データの組み込み方
次にデータの組み込み方です。
let minnano_seiseki = [];//みんなの成績まとめ
minnano_seiseki[0] = new seiseki("田中",70,65);//[0]番.田中さん,数学70点,国語65点
minnano_seiseki[1] = new seiseki("佐藤",90,45);//[1]番.佐藤さん,数学90点,国語45点まず、let minnano_seiseki = [];で、リストを作ります。 この中にクラスのデータを入力します。
minnano_seiseki[0] = new seiseki("田中",70,65);//[0]番.田中さん,数学70点,国語65点
minnano_seiseki[1] = new seiseki("佐藤",90,45);//[1]番.佐藤さん,数学90点,国語45点new seiseki() で、クラスの中にデータを入力していきます。 入力データは[ , ]で区切ります。 constructor(namae,sugaku,kokugo) に入力した順番で、名前付けされてされていきます。
constructor(namae,sugaku,kokugo) {
this.namae = namae;//名前を記録します
this.sugaku = sugaku;//数学
this.kokugo = kokugo;//国語
}クラスのデータを引き出す
document.write(minnano_seiseki[0].namae); で、minnano_seiseki[0].namae…、リスト０番の名前「田中」さんが表示できます。
minnano_seiseki[0].sugakuですと、田中さんの数学の点数「７０」。
minnano_seiseki[1].kokugoですと、リスト１番「佐藤」さんの国語の点数「４５」と表示されます。
うーん…わかったような、わからないような…
少しずつ覚えていくッピよ～！
全体のコードの確認
<script>
class seiseki{//seisekiというクラスを作りますという宣言
constructor(namae,sugaku,kokugo) {
this.namae = namae;//名前を記録します
this.sugaku = sugaku;//数学
this.kokugo = kokugo;//国語
}
}
let minnano_seiseki = [];//みんなの成績まとめ
minnano_seiseki[0] = new seiseki("田中",70,65);//[0]番.田中さん,数学70点,国語65点
minnano_seiseki[1] = new seiseki("佐藤",90,45);//[1]番.佐藤さん,数学90点,国語45点
document.write(minnano_seiseki[0].namae);//みんなの成績[0]番の名前を表示してください
</script>- クラスはリストのデータに名前をつけて取り出しやすくしたもの
- クラスを書くにはクラスの宣言が必要
- コンストラクタでデータの受け皿を作る
- new 名前(数字または,”文字”,)でクラスのデータを入力する
上手くできたッピか？
これからも色んなゲーム作りやプログラムの解説をしていくッピ！
次回も楽しみにしているッピよ～～！
