ホームページ > 記事 > ウェブフロントエンド > JavaScript のカプセル化と継承を完了するための最小限の方法

JavaScript のカプセル化と継承を完了するための最小限の方法

小云云オリジナル: 2017-11-30 09:25:361430ブラウズ

この記事では、初心者向けの比較的新しい知識、つまり最小限の方法で JavaScript クラスを作成することについて話します。「ミニマリストアプローチ」はオランダ人プログラマー、ガボール・デ氏の作品です Mooij によって提案されたこの方法は、これとプロトタイプを使用せず、コードが非常に簡単に展開できるため、おそらく「ミニマリスト方法」と呼ばれます。以下では、最小限の方法で JavaScript のカプセル化と継承を完了する方法を紹介します。皆さんの参考になれば幸いです。

1. カプセル化

まず、これも「クラス」をシミュレートするためにオブジェクトを使用します。このクラスでは、インスタンスを生成するためのコンストラクター createNew() を定義します。

var Cat = {
　　　　createNew: function(){
　　　　　　// some code here
　　　　}
};

次に、createNew()でインスタンスオブジェクトを定義し、このインスタンスオブジェクトを戻り値として使用します。

var Cat = {
 　　　　createNew: function(){
 　　　　　　var cat = {};
 　　　　　　cat.name = "大毛";
 　　　　　　cat.makeSound = function(){ alert("喵喵喵"); };
 　　　　　　return cat;
 　　　　}
 };

使用する場合は、createNew()メソッドを呼び出してインスタンスオブジェクトを取得します。

var cat1 = Cat.createNew();
cat1.makeSound(); // 喵喵喵

この方法の利点は、理解しやすく、明確で洗練された構造を持ち、従来の「オブジェクト指向プログラミング」構造に準拠しているため、次の機能を簡単に導入できることです。

2. 継承

あるクラスが別のクラスを継承できるようにすると、実装するのに非常に便利です。前者の createNew() メソッド内で後者の createNew() メソッドを呼び出すだけです。
まず、Animal クラスを定義します:

var Animal = {
　　　　createNew: function(){
　　　　　　var animal = {};
　　　　　　animal.sleep = function(){ alert("睡懒觉"); };
　　　　　　return animal;
　　　　}
};

次に、Cat の createNew() メソッドで、Animal の createNew() メソッドを呼び出します

var Cat = {
 　　　　createNew: function(){
 　　　　　　var cat = Animal.createNew();
 　　　　　　cat.name = "大毛";
 　　　　　　cat.makeSound = function(){ alert("喵喵喵"); };
 　　　　　　return cat;
 　　　　}
 };

このようにして取得された Cat インスタンスは、Animal クラスを継承します。

var cat1 = Cat.createNew();
cat1.sleep(); // 睡懒觉

3. プライベートプロパティとプライベートメソッド

createNew() メソッドでは、メソッドとプロパティが cat オブジェクトで定義されていない限り、それらはプライベートです。

var Cat = {
　　　　createNew: function(){
　　　　　　var cat = {};
　　　　　　var sound = "喵喵喵";//私有属性
　　　　　　cat.makeSound = function(){ 
     alert(sound); 
    };
　　　　　　return cat;
　　　　}
};

上記の例の内部変数soundは外部から読み取ることができず、catのpublicメソッドmakeSound()を通じてのみ読み取ることができます。

var cat1 = Cat.createNew();
alert(cat1.sound); // undefined

4. データ共有

場合によっては、すべてのインスタンスオブジェクトが同じ内部データを読み書きできるようにする必要があります。この時点では、内部データをクラスオブジェクト内および createNew() メソッドの外にカプセル化するだけです。

var Cat = {
　　　　sound : "喵喵喵",
　　　　createNew: function(){
　　　　　　var cat = {};
　　　　　　cat.makeSound = function(){ alert(Cat.sound); };
　　　　　　cat.changeSound = function(x){ Cat.sound = x; };
　　　　　　return cat;
　　　　}
};

次に、2 つのインスタンスオブジェクトが生成されます:

var cat1 = Cat.createNew();
var cat2 = Cat.createNew();
cat1.makeSound(); // 喵喵喵

このとき、一方のインスタンスオブジェクトが共有データを変更すると、もう一方のインスタンスオブジェクトも影響を受けます。

cat2.changeSound("啦啦啦");
cat1.makeSound(); // 啦啦啦

ミニマリズムは美しく見えますが、欠点もあります。まず、instanceof を使用してオブジェクトが属するクラス (cat1 インスタンスオブ) を決定することはできません。さらに、ミニマリズムはプロトタイプチェーンを使用することの欠点 (プロパティをプライベートにできない、オブジェクトの作成と継承が直観的ではない) を取り除くものの、プロトタイプチェーンを使用しないことによる欠点も明らかにします。インスタンスが生成されると、それは必要になります。繰り返しのコンテンツの場合、より多くのメモリを占有します。

上記の内容は、JavaScript を記述するための最小限の方法に関するものです。

JavaScript のカプセル化と継承を完了するための最小限の方法

関連記事