2022/10/18 (更新日: 2022/10/24)

Classについて

JavaScript

Classを使うことで効率の良いコードが書ける様になる 積極的に使おう

定義

似たようなオブジェクトを生成するための設計図

クラス構文の使い方

定義する

class User {}

インスタンス化する

new User();

定義時に書けるもの

constructor関数

インスタンス化された時に最初に実行される関数

class User {
	constructor(name, age) {
		this.name = name;
		this.age = age;
	}
}

省略記法のメソッド

インスタンス化されたオブジェクトのプロトタイプに登録される

class User {
	greeting() {
		hogehoge....
	}
	post() {
		fugafuga....
	}
}

フィールド（新機能）

プロパティを直接定義できる

どの様なオブジェクトが生成されるかわかりやすくなる

class User {
	id = 120;
	hasChild = true;
}

#を使ってプライベートなプロパティを定義する

クラス内でしかアクセスできないプロパティ

class User {
	#id = 120;
	#hasChild = true;
	get id() { 
		return this.#id;
	}
}
const user1 = new User;
console.log(user1.id); // 120
console.log(user1.hasChild); // getterがないのでエラー 

getter,setter,staticの使い方

getter,setter

class User {
	get greeting() {}
	set post() {}
}

static

class User {
	static greeting(){}
}

プロトタイプに登録されずにクラスに直接定義される

• Tweet