%20(1).png "プログラミング")
クラス
オブジェクトの設計書。オブジェクトのテンプレート。オブジェクトのテンプレートの中だけで、オブジェクトの処理を完結する（カプセル化）。
※実際には特別な関数。
クラス宣言（クラス文）
class Rectangle {
...
}classキーワード + クラス名で宣言できる。
クラス宣言は、宣言の巻き上げは行われない。（関数文は、巻き上げが行われる。関数式は宣言の巻き上げは行われない。）
クラス宣言（クラス式）
// 無名
const Rectangle = class {
...
}
// 名前付き
const Rectangle = class Rectangle2 {
...
}名前付きでも、名前無し（無名）でも宣言できる。
クラス式によるクラス宣言も同様に、宣言の巻き上げは行われない。（関数文は、巻き上げが行われる。関数式は宣言の巻き上げは行われない。）
コンストラクター
クラスの初期化するためのメソッド。
constructor(){}で定義する。1つのクラスに1つしか定義できない。
※メソッド：オブジェクト内の関数のこと。
クラスの使い方
// 1.クラス文
class Person {
constructor() { //2.コンストラクター
this.name = 'Aichan';
}
}
const person1 = new Person(); //オブジェクト作成
console.log(person1.name); //"Aichan"1.クラスの宣言を行う。（テンプレを作成するイメージ）
2.コンストラクターでオブジェクト作成時に行う初期設定を定義する。
3.newキーワード+クラス名で、オブジェクト作成する（テンプレからモノを作成するイメージ）
ちょっとした挙動
// クラス式
const person2 = class Person{
constructor(){
this.name = 'Aichan';
}
}
console.log(person2.name);この場合、結果は、 "Person"と出力される。
理由は、
・クラス宣言は特別な関数である
・関数(function)のnameプロパティを参照している
からである。
...
console.log(typeof person2); //"function"
console.log(typeof new person2); //"object"そのため、newしないと、オブジェクトにならない。
// クラス式
const person2 = class Person{
constructor(){
this.name = 'Aichan';
}
}
console.log((new person2).name); 結果は、"Aichan"と出力される。
newしてオブジェクト作成後のnameを出力すると、想定の動作になる。
Strictモード
クラス本体はStrictモードで実行される。
Strictモードとは、
・JavaScript で暗黙に失敗する一部のものを、エラーが発生するように変更することでする。
・JavaScript エンジンによる最適化処理を困難にする誤りを修正する。
・将来の ECMAScript で定義される予定の構文の使用を禁止する。
staticキーワード
// クラス文
class Person {
constructor() {
this.name = 'Aichan';
}
static hello = 'あいちゃんだよん';
}
const person1 = new Person();
console.log(person1.name); //"Aichan"
console.log(person1.hello); //undefined
console.log(Person.hello); //"あいちゃんだよん"staticキーワードをつけると、newしたオブジェクトから呼び出すことはできない。
クラスをnewしないで呼び出すことはできる。
クラスフィールド
class Counter {
count = 0 //クラスフィールド
increment() {
this.count ++
}
display() {
console.log(this.count)
}
}
const c = new Counter();
const c2 = new Counter();
c.display() //0
c.increment()
c.increment()
c.display() //2
c2.display() //0クラスフィールドとは、クラス内の変数のこと。
宣言すると、クラス内では常に存在する。
それぞれのオブジェクトで独自に存在する。
継承
親クラス(スーパークラス)を引き継いだ、子クラス(サブクラス)を作ること。
継承には、extendsキーワードをつかう。
サブクラスにコンストラクターが存在する場合は、super()を呼ぶ必要がある。
メソッドを拡張できる。
super.スーパークラスのメソッド とすると、スーパークラスのメソッドも呼べる。
class Animal {
constructor(name) {
this.name = name;
}
speak() {
console.log(`${this.name} は、鳴きます。`);
}
}
class Cat extends Animal {
constructor(name) {
super(name); // スーパークラスのコンストラクターを呼び出し、name パラメータを渡す
}
speak() {
console.log(`${this.name} は、にゃーにゃーと鳴きます。`);
}
exciting(){
console.log(`${this.name} は、興奮するとゴロゴロなります。`);
}
superSpeak(){
super.speak();
}
}
const c = new Cat('ごろすけ');
c.speak(); // ごろすけ は、にゃーにゃーと鳴きます。
c.exciting(); // ごろすけ は、興奮するとゴロゴロなります。
c.superSpeak(); // ごろすけ は、鳴きます。といった感じで使える。
※バッククォート(`)の中に${変数名}とすると、文字列に変数を埋め込みできる。
getter, setter
getterは、クラス内の値を取得して返す。
setterは、クラス内の値に他の値を設定する。
getキーワード + メソッド名でgetterを定義できる。
setキーワード + メソッド名でsetterを定義できる。
class Cat {
constructor(name) {
this.name = name
}
get getName() {
/* get構文 */
return this.name
}
set setName(name) {
/* set構文 */
this.name = name
}
}
const cat = new Cat("ごろちゃん");
console.log(cat.getName) //ごろちゃん
cat.setName = "ごろすけ"
console.log(cat.getName) //ごろすけ
0 件のコメント:
コメントを投稿