クラス -> ES6（ES2015）
いよいよわかりやすい class がきた～♪
MDN：クラス
前提
まだ全然わかっていないけど、
本日あちこち読んでみて、理解したと思えることを記述。
理解が深まるに連れて、改変。
書き方も色々とあるみたいだけど
他言語とできるだけ似た形で
私が理解しやすい書式を採用。
書式
- class Humane {
- // コンストラクタ
- constructor(name) {
- // メンバ変数（プロパティ）
- this.name = name
- this.age = 20;
- }
- // 一般メソッド（prototype）
- eat() {
- }
- // 静的メソッド（static）
- static sleep() {
- }
- // getter
- get age() {
- return this.age;
- }
- // setter
- set age(age) {
- this.age = age;
- }
- }
メンバ変数（プロパティ）
メンバ変数は、コンストラクタの中へ記述。
メソッド
function キーワードを抜いて記述。
コンストラクタ
クラスがインスタンス化される際に一度だけ実行される。
一般メソッド
インスタンス化しないと利用できない。
静的メソッド
インスタンス化せずに利用する。
インスタンス化すると利用できない！ らしい。。。
ユーティリティ系に利用されることが多い。
getter, setter
上記のように記述することで、クラスプロパティのように利用できる。
- var hayata = new Human('Hayata');
- // setter を利用
- hayata.age = 42000;
- // getter を利用
- var ultramanAge = hayata.age;
- console.log(ultramanAge + '歳');
- // 42000歳
継承
書式
- class Taiin extends Humane {
- constructor(name) {
- // 親クラスのコンストラクタを呼び出し
- super();
- }
- eat() {
- // 親クラスのメソッドを呼び出し
- super.eat();
- }
- change() {
- }
- }
親クラス
親（基底、スーパー）クラスの呼び出しキーワードは super。
多重継承
できない。
参考サイト
ウェブの葉：クラス構文について[class][コンストラクタ][ES6]（2017-06-03）
HTML5Experts.jp：JavaScriptにもクラスがやってきた！JavaScriptの新しいclass構文をマスターしよう（2015-10-16）