javascriptES2015のclassが使えない環境での、クラスの定義方法をまとめました。本当は最新のブラウザでclassが使えれば、それにこしたことはないのですが、諸事情によりレガシー対応しなきゃいけない場合、こちらの方法でclassを定義します。プライベートメンバについてはこちらに記載しています。プロパティクラスで定義した変数のことです。静的プロパティ、インスタンスプロパティがあります。静的プロパティクラスをインスタンス化しなくても使用できます。インスタンス全体で共有する用途で使用します。インスタンスプロパティインスタンス化しないと使用できません。各インスタンスごとに管理したい値に使用します。メソッドクラスに持たせる機能(関数)のことです。prototypeを使用して定義します。静的メソッド、インスタンスメソッドがあります。静的メソッドクラスをインスタンス化しなくても使用できます。インスタンス全体で共有する機能で使用します。静的メソッドからインスタンスプロパティにはアクセスできません。インスタンスメソッドインスタンス化しないと使用できません。インスタンス変数を使用して行う処理に使用します。コンストラクタークラスをインスタンス化した時の初期化処理を定義します。以下では、車クラスを例にどのようにクラスを定義するかみていきます。走行可能距離を表示と、上記のコードをみて、ぴーんときた方は、以下の説明は見なくても大丈夫かと思います。JavaScriptのクラス定義は、function関数を使用して行います。静的プロパティの定義は、以下のように行います。値;インスタンスプロパティの定義は、以下のように行います。値;ここでのthisはインスタンス自身を指します。静的メソッドの定義は、以下のように行います。function(引数は任意){処理};引数は任意の数指定できます。静的メソッドからインスタンス変数にはアクセスできない点に注意です。インスタンスメソッドの定義は、以下のように行います。静的メソッドインスタンス化しなくても使用することができます。簡単に使用することができます。インスタンスメソッドクラスをインスタンス化して、インスタンスから呼び出します。走行可能距離を表示このように、インスタンス名.メソッド名で簡単に呼びだすことができます。まとめES2015より前の世界の、JavaScriptのクラス定義方法について記載しました。全体を通してのポイントは、以下になります。1のfunctionの定義内容がコンストラクタとなる。プロパティは変数、メソッドは機能を定義する。静的〜は、インスタンス化せず、クラスオブジェクトからそのまま使用できる。インスタンス〜は、インスタンス化したのち使用することができる。【JavaScript入門】ローカル変数の独特な振る舞いJavaScriptのローカル変数特有の振る舞いについて記載しています。それぞれの方法で、処理時間を計測してみました。方が早い結果になりました。記事を読む【JavaScript入門】Liveなオブジェクトのlengthとのつきあい方JavaScriptのLive(動的)なオブジェクトのlengthプロパティについての注意点(つきあい方)について記載しています。記事を読む【JavaScript入門】変数スコープのまとめjavascriptでの変数スコープについてまとめました。(グローバルスコープ、ローカルスコープ、ブロックスコープ、即時関数)記事を読む【JavaScript入門】Liveなオブジェクトと非Liveなオブジェクトの違いJavaScriptのLive(動的)、非Live(静的)なオブジェクトの振る舞いについて記載しています。記事を読む【JavaScript入門】要素のテキストを設定・取得する方法JavaScriptで、要素の文字列を取得・設定する方法について記載しています。メソッドについて記載しています。記事を読む【JavaScript入門】イベント処理のキャンセル方法JavaScriptのイベント処理のキャンセル方法について記載しています。配列への繰り返し処理の違いについて記載しています。記事を読む【JavaScript入門】delete演算子の使い方javascriptのdelete演算子の使い方について記載しています。記事を読む【JavaScript入門】要素を追加する方法のまとめJavaScriptで、要素の追加方法についてまとめました。指定した要素の前後への追加、親要素の最初の子要素、親要素の最後の子要素として追加する方法について記載しています。コメントをキャンセルメールアドレスが公開されることはありません。