IT知識の秘伝書

クラスとメソッド

X(Twitter) facebook はてなブックマーク LINE
OgImage

class(クラス)とmethod(メソッド)とは作成したプログラムを別のプロジェクトでも使いやすいようにしたり、1つのクラスから大量に変数などを実体化して使う、とても再利用性の高くなる機能だ。

classについて

classは2015年のバージョン(ES6)から登場した機能で、プログラムのコードでひとまとめにした処理を部品化するイメージだ。ここでは人間のデータを生成するクラスを作ろう。

classのサンプルコード

class Person { constructor(s_name, n_age, b_lisence) { this.name = s_name; this.age = n_age; this.lisence = b_lisence; } } let sato = new Person("佐藤", 35, true); console.log(sato); let yamada = new Person("山田", 27, false); console.log(yamada); let suzuki = new Person("鈴木", 49, true); console.log(suzuki); console.log(suzuki.name);

色が付いて見えにくいかもしれないが、上記コードではダブルクォーテーションで囲まれた文字列以外、色付きはだいたいプログラムの予約語だ。予約語は自分で名前を考えて付ける事はできないプログラミング言語で用意された単語であり機能だ。

ひとつひとつ解説する。

class クラス名 { }

まず、classと書いてその横に好きなクラス名を付ける。頭文字は大文字が基本だが、小文字でも実行できた。

次にconstructor(コンストラクタ)で仮引数を定義する。

constructor(s_name, n_age, b_lisence) { this.name = s_name; this.age = n_age; this.lisence = b_lisence; }

constructorはクラスが呼ばれたら最初に実行されるメソッドだ。メソッドはオブジェクトやクラス内で使える関数のようなもの。

constructor(第1仮引数, 第2仮引数 .....)

仮引数の名前は自分で決める。渡される変数や値を受け取る変数だ。

ここではString(文字列)を表すsでs_name、Number(数値)を表すnでn_age、Boolean(trueかfalseかの論理値)を表すbでb_lisenceとした。もちろんこうする必要はないが分かりやすいように工夫した。

this.プロパティ名でプロパティを宣言できる。プロパティ名は自由に決めて構わないが、このプロパティの単語でそれに代入される値を参照するので分かりやすいものがよい。

let sato = new Person("佐藤", 35, true); console.log(sato);
Person {name: '佐藤', age: 35, lisence: true}

newで実体化する。これをインスタンスといったりインスタンスを生成するといったりする。上記コードではsatoというインスタンスをPersonクラスから生成している。初期化は佐藤、35歳、資格持ちとしている。

折角だから鈴木の名前を単体で参照してみる。

インスタンス.プロパティ でアクセスできる。

let suzuki = new Person("鈴木", 49, true); console.log(suzuki.name);
鈴木

クラスについてまとめ

一番上のコードは佐藤、山田、鈴木と一つのまとまったコードであるクラスで生成した。このようにクラスは機能をひとまとめに部品化して、使う時に実体化させて利用する。部品化というとイメージが湧きにくいかもしれないが、これがたくさんのクラスができると部品のようにそれぞれを使えるようになるのでパーツとして、必要な時に必要な分だけ使えるのだ。

んー難しいですね。クラスについてはだいぶ慣れが必要だと感じました。メソッドについてはあまり説明がなかったのでよろしければ教えてください!
慣れないうちは難しいよな。僕もJavaScriptではそんなにclassを使った事がないから偉そうな事は言えないな。メソッドはクラス内で定義する関数のイメージだ。例を出そう

method(メソッド)について

メソッドとはクラスの中に関数を書く感じだ。厳密に言うと少し違った仕様だったはず。

メソッドのサンプルコード

class MessageShow { ohayou() { console.log("おはよう!"); } konnitiwa() { console.log("こんにちは!"); } konbanwa(num) { if(num === 1) console.log("こんばんは!"); else if(num === 2) console.log("おやすみなさい!"); } } me = new MessageShow(); me.konnitiwa(); me.konbanwa(2);
こんにちは!
おやすみなさい!

あいさつのメソッドを定義してみた。使い方は先ほどと同じ。それでは芸が少しないのでkonbanwaのメソッドだけ引数を付けて実引数が1なら「こんばんは!」実引数が2なら「おやすみなさい!」と表示するようにした。

一つ疑問なのですがconstructorがありません!これは必須ではないのですか?
なくて構わない。コンストラクタを詳しく説明するとなるとJavaScriptで新しめのバージョンの話やそれの機能も話さなくてはならないので省略した。詳しく知りたいなら本を読んでな。できれば最新仕様に対応したものを。。。