Javascript高級技術を共有する

前回はAjaxの部分を整理しましたが、今週は上級テクニックの部分も整理しておきましょう。
1、タイプ検出はObject.prototype.toString.call（obj）を使用する方式です。typeofでもinstance ofでも変数のタイプを正確に判断することができないからです。2、安全なコンストラクタは普通私達がコンストラクタを定義する時に、似たような

function Person(name){
　　this.name = name;
}

を使いますが、その後はvar person=new Personに行かないと（「cnlogs」）。var person=Personです。thisは他のところを指して、他の対象を汚染します。解決方法はthis.propertyを設定する時にthis instance of Personがそうでないと判断したらnew Person（x，x，x）；

function Person(name){
      if(this instanceof Person){
　　     this.name = name;
      }else{
          return new Person(name);
      }
}

しかし、残りのコンストラクタがPerson.call（this，x）という方法で継承を実現しようとしている場合に注意したい。その関数のプロトタイプは、実装前にPersonに向けられます。3、不活性ロード関数は、関数を呼び出す時に、ブラウザ機能を判断する必要がある場合がよくあります。例えば

function createSomething(){
     if(supportH5){
          //do something
     }else{
          //do otherthing
     }
}

ですが、ブラウザが一つの機能をサポートすれば、必ずいつもサポートされています。コードを実行するたびに必要ではないと判断します。一回で十分です。

function createSomething(){
     if(supportH5){
          createSomething = function(){ //   createSomething   
               //do something
          }
     }else{
          //  
     }
}

に書き換えることができます。初めて呼び出した時に判断します。後でこの関数を書き直したら、当然判断できません。 4、関数はjsに結び付けられています。一番混同しているのはthisが誰を指すかの問題です。実は、jsを勉強している間に、結論は関数の中のthisが最終的にこの関数を呼び出す対象を指していることが分かりました。つまり、どのオブジェクトがこの関数を呼び出して、thisがその対象を指していますか？これをはっきりさせたら、関数バインディングは問題ではないです。関数の中のthisを変える方法はコールとapplyですが、この二つの方法で関数を実行します。関数を実行したくないならば、関数をパラメータとしてある関数に伝達して、またthisを変えたいなら、最新のbindを使います。 5、タイマーsetTimeou、set IntervalまたはAjaxなどは非同期であり、マルチスレッドのようであるが、jsは単一スレッドである。これらの方法はスレッドを増加させていない。setTimeout（fn，300）は、300ミリ秒後にjsの実行キューにfnを入れるという意味です。これがキューの中で実行されていない場合（つまり、jsインタプリタが空き状態）は、すぐに実行されます。そうでないと、キューの事務処理が終わったらこの関数を実行します。したがって、setTimeoutまたはsetIntervalは正確な制御時間ではない。もう一つの注意点として、setTimeoutシミュレーションを使ってset Intervalを正確に最小実行時間間隔を制御することができる。 6、タイマーで固定時間の実行方法を使用します。もし一つの方法が長い間実行されたら、ブラウザが短い時間で応答しないかもしれません。タイマーで一定時間ごとに一部を実行してもいいです。このように、jsがずっと忙しい状態にあるとは限りません。暇があれば、残りの事務を処理します。例えば、1000の長さの配列サイクルがあれば、100回の実行ができます。中間間隔の時間はjsを暇にして別の操作をします。 7、関数の流れ。関数の流れは性能を向上させる良い方法であり、場合によっては数倍の効率を高めることができる。例えばドラッグやオンスイベントで発生する操作をする場合。操作するたびに、何度も実行しました。

var i = 0;
window.onresize = function(){
    console.log(i++);
}

ブラウザを引っ張り出そうとすると、コンソールが瞬時にiを100以上表示しています。書き方を変えます。例えば、

var i = 0, j = 1;
window.onresize = function(){
     if(j % 2 == 0){
         console.log(i++);
     }
     j++;
}

。
変数jを作成して、偶数の度に実行させます。つまり、実行回数の半分を減らします。このように処理すれば、50%の実行回数を減らすことができますが、ユーザーにとっては、違いは感じられません。また、タイマーを使って実現される関数の流れがあります。コアコードは以下の通りです。
ここには、実行関数と関数の実行環境（すなわち、実行関数におけるthisの指向オブジェクト）が入力され、動作キューをクリアしてから動作を実行します。このような形式は動作周波数をより良く制御することができる。ブラウザのストレッチ動作をすると、引張速度が十分速いと、トリガの時間間隔が100 ms以内であれば、最後の結果を実行するだけです。 8、カスタムイベントの本質は観察者モードです。基本モードは3つの関数が必要で、一つの関数はバインディングイベント、一つの関数はトリガイベント、一つはバインディング解除です。このモードはコード結合性を大幅に低減できる。