javascript:class
差分
このページの2つのバージョン間の差分を表示します。
両方とも前のリビジョン前のリビジョン次のリビジョン | 前のリビジョン | ||
javascript:class [2011/07/05 17:06] – [プロトタイプ] nullpon | javascript:class [2025/09/09 16:23] (現在) – 削除 nullpon | ||
---|---|---|---|
行 1: | 行 1: | ||
- | ====== クラス ====== | ||
- | 厳密にはJavaScriptにクラスはない。機能の異なるオブジェクトは存在するが、それらは持っているプロパティやメソッドが異なっているだけで、オブジェクトの性質には違いはない。 | ||
- | |||
- | ===== コンストラクタ ===== | ||
- | |||
- | Construct関数を不可視プロパティとして持っているオブジェクトは、Construct関数で定義されたプロパティを持つインスタンスを生成することができる。 | ||
- | |||
- | Construct関数を持っているオブジェクトは、いくつかのグローバルオブジェクトと、ユーザが定義した関数オブジェクトである。関数を定義すると、定義された関数オブジェクトはコンストラクタとなり、その関数自身がConstruct関数となる。 | ||
- | |||
- | ==== 標準のオブジェクト型 ==== | ||
- | |||
- | * Boolean | ||
- | * Number | ||
- | * String | ||
- | * Array | ||
- | * Object | ||
- | * Function | ||
- | * RegExp | ||
- | * Date | ||
- | |||
- | <code javascript> | ||
- | var s = new String(" | ||
- | var d = new Date(); | ||
- | </ | ||
- | |||
- | |||
- | ==== ユーザ定義のオブジェクト型 ==== | ||
- | |||
- | <code javascript> | ||
- | // クラス定義1 | ||
- | // コンストラクタ関数 | ||
- | function Greet() { | ||
- | // プロパティの定義 | ||
- | this.message = " | ||
- | |||
- | // メソッドの定義 | ||
- | this.say = function() { | ||
- | return this.message; | ||
- | }; | ||
- | } | ||
- | |||
- | // インスタンスの生成 | ||
- | var greet = new Greet(); | ||
- | |||
- | // メソッドの呼び出し | ||
- | greet.say(); | ||
- | |||
- | </ | ||
- | |||
- | コンストラクタとして使う関数は、慣例として大文字で名前を定義する。 | ||
- | |||
- | ===== プロトタイプ ===== | ||
- | |||
- | 全てのオブジェクトは constructor というプロパティを持っている。これは自分を生成したコンストラクタ関数へのリファレンスである。 | ||
- | |||
- | constructor は prototype というオブジェクトを持っている。あるオブジェクトに対して存在しないメソッドAが呼び出された時、自分のconstructor の prototype がメソッドAを持っていれば、それが実行される。 | ||
- | |||
- | よってコンストラクタ関数の prototype に対してメソッドを定義すれば、そのメソッドを生成したインスタンスから呼び出す事ができる。また、prototype はインスタンス間で共有されるので無駄な関数オブジェクトが生成されることもない。(クラス定義1のようにコンストラクタ関数でメソッドを定義すると、コンストラクタを呼ぶたびに関数オブジェクトを作成するので無駄だが、prototype へのメソッド設定ならば一度で良いので無駄が無い) | ||
- | |||
- | このため、実際のプログラミングでは、メソッドは、prototype に定義し、プロパティはコンストラクタで定義するのが一般的である。 | ||
- | |||
- | <code javascript> | ||
- | // クラス定義2 | ||
- | function Greet() { | ||
- | this.message = " | ||
- | } | ||
- | |||
- | Greet.prototype.say = function() { | ||
- | return this.message | ||
- | } | ||
- | |||
- | var greet = new Greet(); | ||
- | |||
- | greet.say(); | ||
- | </ | ||
- | |||
- | |||
- | prototypeを丸ごと上書きして置き換えることもできます。 | ||
- | <code javascript> | ||
- | // クラス定義3 | ||
- | function Greet() { | ||
- | this.message = " | ||
- | } | ||
- | |||
- | Greet.prototype = { | ||
- | say: function() { | ||
- | return this.message | ||
- | } | ||
- | }; | ||
- | |||
- | var greet = new Greet(); | ||
- | |||
- | greet.say(); | ||
- | </ | ||
- | |||
- | prototypeを上書きした場合と、そうでない場合では厳密には異なるインスタンスを作成する。 | ||
- | |||
- | ===== 継承 ===== | ||
- | |||
- | オブジェクトがプロパティを持っていなければ、コンストラクタの prototype からプロパティを探すが、その prototype も該当するプロパティを持っていなければ、さらにその prototype のコンストラクタの prototype からプロパティ探す。この仕組みをプロトタイプチェーンと呼ぶ。 | ||
- | |||
- | プロトタイプチェーンを使うと継承のような事ができるが、実際に使われる事は少ない。 | ||
- | |||
- | <pre> | ||
- | function Greet() { | ||
- | this.message = " | ||
- | } | ||
- | Greet.prototype.say = function() { | ||
- | return this.message | ||
- | } | ||
- | |||
- | function NightGreet() { | ||
- | this.message = "good night"; | ||
- | } | ||
- | NightGreet.prototype = new Greet(); | ||
- | |||
- | var nightGreet = new NightGreet(); | ||
- | nightGreet.say(); | ||
- | </ | ||
javascript/class.1309885593.txt.gz · 最終更新: by nullpon