クラスの定義
オブジェクト指向のプログラミング言語における、モノ（オブジェクト）を作成する際に必要なものです。
実装方法は、2パターンあります。
- クラス宣言
- 先頭に「class ⚪︎⚪︎」 と宣言する方法
- クラス式
- クラスを値として定義する方法で、クラス名は定義してもしなくても良い方法
クラス宣言について
まずクラス名を設定するには、基本的に大文字から始めるルールというあります。
そしてそのクラスの中には、コンストラクター(constructor)が存在します。
コンストラクターとは、クラスで生成されたインスタンスを初期化するメソッドのことで、1つのクラスの中で1度だけ使用することが可能です。
クラスからインスタンスを生成するには、必ずnew演算子を使用する必要があります。new を宣言して、クラス内でインスタンス作成することをインスタンス化と呼びます。
今回は、プロフィールを例にして考えてみます。
class Profile {
// インスタンスを初期化する
constructor(name, age) {
// コンストラクター内の記述のことを、インスタンスプロパティと呼ぶ
this.name = name;
this.age = age;
}
}
// new を宣言してインスタンス作成(インスタンス化)
const profA = new Profile('Taro', 15)
const profB = new Profile('Hanako', 20)
console.log(profA);
console.log(profB);
// 結果は...
Profile { name: 'Taro', age: 15 }
Profile { name: 'Hanako', age: 20 }
クラス式
名前付きクラスの名前は、クラス内のローカルとして扱われます。(ただし (インスタンスのではなく) クラスの name プロパティによって取得可能)
(参照元) MDN Web Docs
この説明だけでは少し分かりにくかったので、参照元にも掲載されていますが、私も手元で確かめてみることにしました。
- クラス名を定義する書き方
const Profile = class ProfileA {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
console.log(Profile);
console.log(Profile.name);
// 結果は...
[class ProfileA]
ProfileA
- クラス名を定義しない書き方
const Profile = class {
constructor(name, age) {
this.name = name;
this.age = age;
}
}
console.log(Profile);
console.log(Profile.name);
// 結果は...
[class Profile]
Profile
実際に手元で確かめてみることにしました。
クラス名を定義した場合には、定数名Profileの値を出力すると、クラス名のProfileAが表示されます。
クラス名を定義しない場合には、定数名Profileの値を出力すると、そのままProfileが表示されます。
参照元の文章は少し難しく感じましたが、試してみて目で確認すると実際は難しいことを言っていないのがよく分かります。
終わり
今回は以上になります。
最近JavaScriptを触れ始めたのですが、これはどういう意味？、何が起きている？と混乱の日々です。小さな気づきや得たことを忘れないように、サボり気味だったQiitaさんにまた少しずつ投稿いていきたいと思います。
また、もし内容に誤りなどがございましたら、ご指摘いただけますと幸いです。