差分

このページの2つのバージョン間の差分を表示します。

--- javascript:class [2011/07/14 02:52] – nullpon
+++ javascript:class [2016/01/19 07:56] (現在) – [継承] nullpon
@@ 行 1: / 行 1: @@
 ====== クラス ======
-厳密にはJavaScriptにクラスはない。機能の異なるオブジェクトは存在するが、それらは持っているプロパティやメソッドが異なっているだけで、オブジェクトの性質には違いはない。
-===== コンストラクタ =====
+===== クラス構文 =====
-Construct関数を不可視プロパティとして持っているオブジェクトは、new 演算子によって新しいオブジェクト（インスタンス）を生成することができる。
+ECMAScript 2015からクラス構文が導入された。
-いくつかのグローバルオブジェクトと、ユーザが定義した関数オブジェクトがConstruct関数を持っている。
+<code javascript>
+'use strict';   // クラス構文の使用にはstrictモードが必須です
-全てのユーザ定義関数は、自分自身をConstruct関数として持っているので、ユーザ定義関数は全て自動的にコンストラクタとなる。
+class Hoge {
+  // コンストラクタ
+  constructor(val) {
+    this._value = val
+  }
+  // メソッド
+  print() {
+    console.log(this._value);
+  }
+  // ゲッター
+  get value() {
+    return this._value;
+  }
+  // セッター
+  set value(val) {
+    this._value = val;
+  }
+}
-==== 標準のオブジェクト型 ====
+var hoge = new Hoge(1);
-  * Boolean
+hoge.print();   // => 1 と出力
-  * Number
-  * String
-  * Array
-  * Object
-  * Function
-  * RegExp
-  * Date
-<code javascript>
+hoge.value = 2;
-var s = new String("a");
-var d = new Date();
+console.log(hoge.value)   // => 2 と出力
 </code>
+これは以前のprototypeによるクラス定義のシンタックスシュガーにすぎず、Hogeは関数オブジェクトとして定義されている。
+<code>
+typeof(Hoge);   // => function
+</code>
+ただし関数としての呼び出しには制限がかけられており、newを付けずに呼び出すとエラーになる。
+<code>
+Hoge();   // => TypeError: Class constructors cannot be invoked without 'new'
+</code>
+==== 継承 ====
+<code>
+class Fuga extends Hoge {
+  // メソッド
+  print2() {
+    console.log(this._value * 2);
+  }
+}
+var fuga = new Fuga(3);
+fuga.print();    // => 3 と出力
+fuga.print2();   // => 6 と出力
+</code>
+==== staticメソッド ====
+<code>
+class Piyo extends Hoge{
+  // メソッド
+  static piyo() {
+    console.log('ピヨピヨ');
+  }
+}
+Piyo.piyo();    // => ピヨピヨ と出力
+</code>
+===== prototypeによるクラス定義 =====
+ここからはES5以前の話
-==== ユーザ定義のオブジェクト型 ====
+==== コンストラクタ ====
-コンストラクタとして使う関数は、慣例として大文字で名前を定義する。
+関数はコンストラクタとして働く。コンストラクタとして使う関数は、慣例として大文字で名前を定義する。
 <code javascript>
@@ 行 66: / 行 125: @@
 </code>
-===== プロトタイプ =====
+==== プロトタイプ ====
 コンストラクタは prototype というプロパティを持っている。
@@ 行 121: / 行 180: @@
 </code>
-===== __proto__ =====
+==== __proto__ プロパティ ====
 new演算子で作成されたインスタンスは、内部的に <html>__proto__</html> というプロパティを持っている。これはコンストラクタ関数の prototype と全くオブジェクトを参照している。