JavaScript_javascript スキルでクラス メカニズムとプライベート変数をシミュレートするための方法とアイデア

一部の Javascript フレームワークを使用している場合、同様のコードが表示される場合があります。

コードをコピー コードは次のとおりです:

var MyClass = new Class({
初期化: function(param, ...) {
this.param = param;
...
},
func1: function( ...) {
...
}
});
var myObj = new MyClass(param);
myObj.func1(...);

これは典型的なオブジェクト指向のクラス メカニズム アプリケーションであり、ネイティブの Javascript クラス メカニズムよりも明確で自然です。さらに、これに基づいて、クラス継承を実装するとさらに便利になります。では、これはどのようにして達成されるのでしょうか?
ご存知のとおり、JavaScript では関数をコンストラクターとして使用してオブジェクトを作成できます。

コードをコピー コードは次のとおりです:

function MyClass(param) {
this.param = param;
this.func1 = function(..) {
...
};
}
var myObj = new MyClass(param);
myObj.func1();

実際には、非常に単純で難しくありません。ただし、大規模な Javascript クラス ライブラリを構築する場合、大量のコードからどれがクラスで、どれが関数で、どれがクラス属性であるかを見つけるのは面倒です。
もちろん、これはメリットとデメリットを比較するためではなく、新しいクラスがどのように実装されるかに興味があるだけです。
上記のコードで new MyClass() のようなステートメントを使用することは、MyClass が関数である必要があることを意味し、また、リテラルの意味から、その関数が関数オブジェクトを返す必要があることを意味します。 initialize コンストラクタとして使用されるため、new Class から返される関数では、initialize を使用してオブジェクトを初期化する必要があります。この分析に基づいて、次のコードを導き出すことができます:

コードをコピー コードは次のとおりです:

function Class(argu) {
return function() {
var init = argu['initialize'] function() {}; // コンストラクタの初期化がない場合は、空の関数を使用します。デフォルトのコンストラクターとして
| for(var p in argu) {
| this[p] = argu[p];
| 元の this
}
}

上記のコードは厳密さが十分ではありませんが、問題を説明するには十分です。 init.apply(this, argument) という文に注意する必要があります。ここには変数への参照がいくつかありますが、これは元々はInitialize のデフォルトであり、現在は返される匿名関数の this に置き換えられています。 、そしてこの匿名関数 は、新しいクラスを通じて作成されたカスタム クラスのコンストラクターです。もう 1 つは引数で、匿名関数のパラメータを参照します。これは、上記の new MyClass(param) のパラメータです。
この変換は少しめまいがするので、もっと簡単な方法はありますか?以下のコードを見てください:

コードをコピー コードは次のとおりです:

関数クラス(argu) {
var obj = argu['initialize'] || function() {};
for(var p in argu) {
obj.prototype[p] = argu[p]; //注意してください、ここで使用されているのは、prototype
}
return obj // 実際には、やはり関数
}

を返します。 。
これで、単純なクラスメカニズムの構築が完了しました。このメカニズムを通じて、クラス コンストラクター、メソッド、プロパティを作成できますが、これらは明らかにパブリックです。では、プライベート変数とメソッドを実装するにはどうすればよいでしょうか。
JavaScript クラスのプライベート変数はクロージャ メカニズムを通じて完了できることがわかっています。ただし、 new Class({...}) を使用して変換した後は、効果的なクロージャを形成するのが明らかに困難です。この問題を回避するにはどうすればよいでしょうか?
JavaScript には、関数オブジェクトの eval() メソッドと toString() メソッドという 2 つのメソッドが用意されており、前者は関数の特定のコードを取得するために使用できます。これら 2 つの方法を使用すると、クラスのプライベート変数を簡単にシミュレートできます:

コードをコピーします コードは次のとおりです:

Function Class(argu) {
var _ = argu['private'] || {};
eval('var obj = ' (argu['initialize'] || function( ) {}).toString());
for(var p in argu) {
if(p == 'initialize' || p == 'private')
continue;
if (typeof argu[p] == 'function')
eval('obj.prototype[p] = ' argu[p].toString());
else
obj.prototype[p] = argu[p];
}
return obj;
}

関数オブジェクトのtoString()メソッドで関数コードを抽出し、evalメソッドで実行これらのコードにより、有効なクロージャ スコープを構築してプライベート メカニズムを実装できます。次のように適用できます:

コードをコピー コードは次のとおりです:

var person = 新しいクラス({
プライベート: {
身長: 160,
体重: 50
},
初期化: function(名前, 身長, 体重) {
this.name = name;
_.height = 身長 || _.height;
_.weight = 体重 || _.weight;
},
show: function() {
alert('名前:' これ。名前 '/nheight:' _.height '/nweight:' _.weight);
}
});
var my = new Person("Zh");
my.show( );

見た目は良くありませんが、実際のアプリケーションではあまり役に立ちません。主に効率の面で、通常の実装に比べて約4倍の時間がかかります。大規模なクラス ライブラリの構築では、これは許容できませんが、小規模なアプリケーションでは、次のコードを実装する方が簡単かつ直接的です:

コードをコピー コードは次のとおりです:

function MyClass(param) {
var privateVar = ...;
this.param = param;
this。 func = function () {
alert(privateVar);
};
}