導入
この記事では、主にオブジェクトを作成するパターンの次の記事を紹介します。さまざまな手法を使用すると、エラーを大幅に回避したり、非常に合理化されたコードを記述したりできます。
パターン6:機能構文砂糖
関数構文砂糖は、オブジェクトにメソッド(関数)をすばやく追加するための拡張機能です。これは主にプロトタイプの特性を使用します。コードは比較的簡単です。まず実装コードを見てみましょう。
コードコピーは次のとおりです。
if(typeof function.prototype.method!== "function"){
function.prototype.method = function(name、実装){
this.prototype [name] =実装;
これを返します。
};
}
オブジェクトを拡張する場合、次のように使用できます。
コードコピーは次のとおりです。
var person = function(name){
this.name = name;
}
.method( 'getName'、
関数 () {
this.nameを返します。
})
.method( 'setname'、function(name){
this.name = name;
これを返します。
});
このようにして、2つのメソッドを追加します。GetNameとSetNameはPerson Functionです。次に、結果を確認しましょう。
コードコピーは次のとおりです。
var a = new Person( 'Adam');
console.log(a.getname()); //「アダム」
console.log(a.setname( 'eve')。getname()); //「イブ」
パターン7:オブジェクト定数
オブジェクト定数は、SET、GET、ifDefinedによって提供されるさまざまな方法の具体化です。さらに、設定されたメソッドは最初のオブジェクトセットのみを保持し、後の設定は無効になり、他の人が過負荷にならないという目的を達成しました。実装コードは次のとおりです。
コードコピーは次のとおりです。
var constant =(function(){
var定数= {}、
OwnProp = object.prototype.hasownproperty、
//これらの3種類の値のみが許可されています
許可= {
文字列:1、
番号:1、
ブール:1
}、
prefix =(math.random() + "_")。スライス(2);
戻る {
//名前名でプロパティを設定します
セット:function(name、value){
if(this.isdefined(name)){
falseを返します。
}
If(!
falseを返します。
}
定数[プレフィックス + name] = value;
trueを返します。
}、
//名前という名前のプロパティがあるかどうかを判断します
isdefined:function(name){
return ownprop.call(constants、prefix + name);
}、
//名前の属性を取得します
get:function(name){
if(this.isdefined(name)){
定数を返す[プレフィックス +名前];
}
nullを返します。
}
};
}());
検証コードは次のとおりです。
コードコピーは次のとおりです。
//存在するかどうかを確認します
console.log(constant.isdefined( "maxwidth")); // 間違い
// 意味
console.log(custrance.set( "maxwidth"、480)); // 真実
// retest
console.log(constant.isdefined( "maxwidth")); // 真実
//再定義してみてください
console.log(custrance.set( "maxwidth"、320)); // 間違い
//元の定義がまだ存在するかどうかを判断します
console.log(custrent.get( "maxwidth")); // 480
モード8:サンドボックスモード
Sandboxモードは、他のモジュールのコンテキストに影響を与えることなく、1つ以上のモジュールに個別のコンテキストを提供します。たとえば、3つの方法イベント、DOM、およびAjaxを備えたサンドボックスがあります。それらの2つが環境を形成するために呼び出された場合、3つの環境への干渉はありません。サンドボックスの実装コードは次のとおりです。
コードコピーは次のとおりです。
function sandbox(){
//パラメーターを配列に変換します
var args = array.prototype.slice.call(arguments)、
//最後のパラメーターはコールバックです
callback = args.pop()、
//最後のパラメーターを除き、選択する他のすべてのモジュール
modules =(args [0] && typeof args [0] === "string")? args:args [0]、
私;
//新しいオペレーターを強制します
if(!(このinstanceof sandbox)){
新しいサンドボックス(モジュール、コールバック)を返します。
}
//プロパティを追加します
this.a = 1;
this.b = 2;
//このオブジェクトにモジュールを追加します
//モジュールがない場合、または渡されたパラメーターが「*」の場合、すべてのモジュールが渡されます
if(!モジュール||モジュール== '*'){
モジュール= [];
for(i in Sandbox.modules){
if(sandbox.modules.hasownproperty(i)){
modules.push(i);
}
}
}
//必要なモジュールを初期化します
for(i = 0; i <modules.length; i += 1){
sandbox.modules [modules [i]](this);
}
//コールバックを呼び出します
コールバック(this);
}
//デフォルトでプロトタイプオブジェクトを追加します
sandbox.prototype = {
名前:「私のアプリケーション」、
バージョン:「1.0」、
getName:function(){
this.nameを返します。
}
};
次に、デフォルトの初期モジュールを定義します。
コードコピーは次のとおりです。
sandbox.modules = {};
sandbox.modules.dom = function(box){
box.getElement = function(){
};
box.getStyle = function(){
};
box.foo = "bar";
};
sandbox.modules.event = function(box){
//必要に応じてサンドボックスプロトタイプへのアクセス:
// box.constructor.prototype.m = "mmmm";
box.attachevent = function(){
};
box.detachevent = function(){
};
};
sandbox.modules.ajax = function(box){
box.makerequest = function(){
};
box.getResponse = function(){
};
};
通話方法は次のとおりです。
コードコピーは次のとおりです。
//メソッドを呼び出します
サンドボックス(['ajax'、 'event']、function(box){
console.log(typeof(box.foo));
// domの選択がないので、box.fooが存在しません
});
sandbox( 'ajax'、 'dom'、function(box){
console.log(typeof(box.attachevent));
//選択されたイベントはないので、イベントで定義されているactibleventも存在しません
});
sandbox( '*'、function(box){
console.log(box); //上記のすべてのメソッドにアクセス可能です
});
3つの異なる呼び出し方法により、3つの方法のコンテキストが異なることがわかります。最初のものにはfooがありません。 AjaxとDomのみがロードされているが、イベントはロードされていないため、2番目のものにはAttachEventがありません。 3番目はすべてをロードしません。
パターン9:静的メンバー
静的メンバーは、c#またはjavaのpublic static and private staticと同様に、関数またはオブジェクトによって提供される静的特性にすぎません。
まず公開会員を見てみましょう。パブリックメンバーはとてもシンプルです。私たちが宣言する方法と機能は、通常は公開されています。
コードコピーは次のとおりです。
//コンストラクター
var gadget = function(){
};
// public staticメソッド
gadget.isshiny = function(){
「bet」を返します。
};
//プロトタイプに追加する通常の方法
gadget.prototype.setprice = function(rice){
this.price = price;
};
//静的メソッドを呼び出します
console.log(gadget.isshiny()); //「あなたは賭け」
//インスタンスを作成し、メソッドを呼び出します
var iphone = new Gadget();
iPhone.setPrice(500);
console.log(typeof gadget.setprice); // "未定義"
console.log(typeof iphone.isshiny); // "未定義"
gadget.prototype.isshiny = gadget.isshiny;
console.log(iphone.isshiny()); //「あなたは賭け」
プライベートな静的メンバーについては、閉鎖機能を使用して実装できます。以下は2つの実装方法です。
最初の実装方法:
コードコピーは次のとおりです。
var gadget =(function(){
//静的変数/プロパティ
var counter = 0;
//閉鎖は、コンストラクターの新しい実装を返します
return function(){
console.log(counter += 1);
};
}()); //すぐに実行します
var g1 = new Gadget(); //ログ1
var g2 = new Gadget(); //ログ2
var g3 = new Gadget(); //ログ3
毎回新しいオブジェクトであるが、数字がまだ増加しており、静的メンバーの目的を達成していることがわかります。
2番目の方法:
コードコピーは次のとおりです。
var gadget =(function(){
//静的変数/プロパティ
varカウンター= 0、
NewGadget;
//新しいコンストラクターの実装
newGadget = function(){
カウンター += 1;
};
//メソッドへのアクセスを承認します
newgadget.prototype.getLastid = function(){
戻りカウンター。
};
//コンストラクターを上書きします
NewGadgetを返します。
}()); //すぐに実行します
var iphone = new Gadget();
iPhone.getLastid(); // 1
var ipod = new Gadget();
iPod.getLastid(); // 2
var ipad = new Gadget();
iPad.getLastid(); // 3
数も増加します。これは、内部認証方法の閉鎖機能を使用して達成されます。
要約します
これは、オブジェクト作成モードの次の記事です。 2つの記事には9つのパターンがあります。これらは、毎日のJavaScriptプログラミングでよく使用するオブジェクト作成モードです。さまざまなシナリオが異なる役割を果たします。それぞれのニーズに応じて、誰もが該当するモードを選択することを願っています。