blog

JS上級シングルトンパターン慣性のアイデア

自己実行関数は、参照データ型であるオブジェクトを実行して返し、外部から受け取りますので、自己実行関数の実行中に形成されたプライベートスコープは破壊されず、内部の変数は保存されます。 このオブジェクトを...

Jan 30, 2020 · 3 min. read
シェア

シングルトンパターン

var obj1 ={
 name:"Lily",
 age:18
}
var obj2 ={
 name:"LiHua",
 age:24
}

上記のように、オブジェクトのプロパティをまとめて中かっこで囲むのが、通常のシングルトンパターンです。

高度なシングルトンパターン

let myFunctions = (function(){
 let name = "Lily",
 age = 18;
 function fn1(){};
 function fn2(){};
 
 return {
 fn1:fn1,
 fn2:fn2
 }
})();

自己実行関数は実行され、参照データ型のオブジェクトを返し、外の世界のmyFunctionsが受け取るので、自己実行関数の実行中に形成されたプライベートスコープは破壊されず、中の変数は保持されます。

このオブジェクトを変数 myFunctions で受け取り、myFunctions 内のメソッドを呼び出したい場合は、メンバとして直接アクセスします。

例えば、myFunctionsのfn1メソッドを呼び出したい場合:

myFunctions.fn1(); これはfn1メソッドを呼び出す

同様に、あなた自身のコードの中で、外の世界から呼び出されたいものは、外の世界から呼び出されるようにmyFunctionsオブジェクトに返すことができます。

高度なシングルトン・パターンの役割

特に複数の人が同じプロジェクトに取り組んでいる場合、自分のコードが外部のコードに干渉されないようにすること、自分のコードが汚染されないようにすること、自分のコードが他人のコードを上書きしないようにすることは可能です。

また、他の人があなたの書いたメソッドを使いたい場合は、上記のようにメンバーが直接アクセスするだけで、そのメソッドを呼び出すことができます。

惰性思考

ケース説明

リクエストする:要素のCSSを取得する方法を手書きしてください:

1. getComputedStyle(ele,null)[attr]。

2、ele.currentStyle[attr] ie6--ie8と互換性があります。

ヒント: in メソッドを使用すると、オブジェクトにプロパティが含まれているかどうかを判断できます。

構文:オブジェクト内の[属性

戻り値がtrueの場合、オブジェクトはこの属性を含んでいます。

function getCss(ele,attr){
 if("getComputedStyle" in window){
 return getComputedStyle(ele)[attr];
 }else{
 return ele.currentStyle[attr];
 } 
 
}
var box = document.getElementById("box");
var res = getCss(box,"width");
console.log(res);

分析:上記の方法は対応する機能を達成することができますが、性能はあまりよくありません、この方法を実行するたびに、属性を取得するために判断する必要があります、あなたは慣性のアイデアを使用して、この方法を最適化することができます。

不活性思考の最適化

function getCss(ele,attr){
 if("getComputedStyle" in window){
 getCss = function(ele,attr){
 return window.getComputedStyle(ele)[attr];
 }; 
 }else{
 getCss = function(ele,attr){
 return ele.currentStyle[attr];
 }; 
 } 
 return getCss(ele,attr);
}
var box = document.getElementById("box");
getCss(box,"width");
getCss(box,"height");
getCss(box,"margin");
...

後に達成した効果を向上させる:ので、唯一のブラウザのバージョンを判断する必要があります一度、その後、再びブラウザのバージョンを判断することなく、再び呼び出すには、直接対応するメソッドを呼び出すと、パフォーマンスを節約することができ、これは慣性のアイデアです。

慣性の考え方: 何かが一度実行されたとしても、二度目も同じ効果があるのであれば、二度目は実行させたくないものです。

クロージャのアイデアの使用は、リファクタリング関数の後に直接判断した後、getCssは、グローバル変数、変数への関数のリファクタリングであり、最終的に再び後の呼び出しの実装に直接返されるときにリファクタリングメソッドの直接実装を判断する必要はありません。

このように、getCssの最初の実行では、このプライベートスコープ内で作成された関数がリファクタリングされ、グローバル変数getCssによってピックアップされるため、このメソッドが最初に実行されたときにスコープが破壊されることはありません。

Simply put, in this case, after the judgement, refactoring the function, after the refactoring of the function in the return to the implementation of the function, the implementation of the return to the results of the return, so that even the first time to execute the results can be obtained, and refactoring after the implementation of another do not need to do the judgement again.

もし間違いがあれば、訂正して一緒に進歩しましょう。

Read next

OAuth2.0について考える

最近、PaaSプラットフォームの責任者は、サービスプロバイダの開発者の多くは、承認プロセスをドッキングの過程で人々は、多くの問題が発生する、成功したアクセスの前に多くのフラストレーションを経験しました。 もちろん、主な理由は、システムがピットを掘る開発者の膨大な数に友好的ではない、常に改善する方法を見つけるために続けていくということです。 あなたは認証システムの設計では、OAuth2.0の十分な理解を持っていない場合...という有名な格言があります。

Jan 30, 2020 · 2 min read