ホームページ >ウェブフロントエンド >jsチュートリアル >JavaScript プログラムに関連する最適化の問題

JavaScript プログラムに関連する最適化の問題

黄舟
黄舟オリジナル
2016-12-15 10:57:361039ブラウズ

JavaScriptプログラムに関連する最適化の問題

これらは、私がコードを書くときのいくつかをまとめたものです。 順序はありません。

1. グローバル変数を使用しないようにします。 function test(){
var s = document.getElementById('aaa');
s.innerHTML = document.body.clientHeight;
s = d.getElementById('aaa');
s.innerHTML = d.body. clientHeight;
}
ローカル変数の利点は、スコープ チェーンの検索が軽減されることです
参照が 2 つある場合はローカル変数を使用することをお勧めします

2. (地球のこの推定値は誰もが知っています) との使用は避けてください
理由は理解していますwith は独自のスコープを作成するため、元のスコープ チェーンが長くなり、with ブロック内で実行されるコードが遅くなります。コードを書く手間が省けるように見えますが、実際には逆にアクセスが長くなり、煩雑になります。 ClientHeight = '200px';
function test(){ var ds = document.body; ds.cli と書くことができます。 entWidth = '200px'
var as = document.getElementsByTagName('div');
for(var i=0,l 私のメソッドは 1 度も使用されていません
for( var i=0,ci;ci=as[i++ ];){}nodeList が完了すると false となり終了します
利点: 長さの計算が不要、ループ内での代入が不要、コードが少なく、i++ が判定に含まれます
(注意:这个方式用在nodelist里可、配列に使用した場合、問題が発生する可能性があります、数グループに 0 後者ヌル何の就瞎了)

4.别用那么多个var、カンマを追加するだけで完了です
var a =1;
var b = 1;
var c =1;
b=1,
c=1;

5.innerHTML が最適です
要素には innerHTML を使用するのが最善です

6.ieのremoveChildは使いにくいです
一般的に要素を削除するときはelm.removeChild(subElm)を使います
これはIEにありますIEではDOMツリーから要素を切断するだけなので使いにくいですですが、実際には削除されません。
本当に削除したい場合は、次のようにすることができます。
div.appendChild(subElm);
div.innerHTML = '';
div = null;
この方法では、ie を除き、removeChild を使用して効果を実現できます

7。イベントを複数の兄弟要素にバインドする必要はありません。各要素のイベントをすべてバインドし、親にバインドするだけです
例:
;/li>

  • sdf
  • sdf
  • & lt;li>自衛隊退屈でオーバーフローしやすいものを追加します (IE)
    実際、UL に追加される限り、問題は発生します
    Var UL = DOCUMENT.GetelementByid ('A');
    Ul.Onclick = Function (e ); {
    //コード
    ネイティブメソッドを使用するようにしてください。ネイティブメソッドは c/c++ でコンパイルされ、js

    9 で書かれたメソッドよりもはるかに高速に実行されるためです。appendChild を長時間使用する場合は、必ず docuemntfragment を使用してください。
    例: for(var i=0;i<1000;i++){
    .createDocumentFragment();
    for(var i=0;i<1000;i++){


    10 を既に使用している場合。 =3 の場合は、switch を使用します。読みやすく、パフォーマンスも優れています

    11。 if<=3、if を使用せず、3 要素の式を使用します

    12、&& を変更する場合。 (if (a == 1) a = 2

    A == 1 && (a = 2);

    13. 要素の位置を計算します。ブラウザ ie6 以降、ff3.1 以降、chrome、opera (私は最新のもののみをテストしました) すべてこれをサポートしています
    el.getBoundingClientRect は、それぞれ上、左、右、下の値であるオブジェクトを返します

    14。検索は、indexOf
    var ほど高速ではありません。 = 'sdfsdfsdfAAAsdfdsfs';
    for(var i=0;i<1000;i++){
    s.indexOf('AAA')
    }
    これより速い
    var s= 'sdfsdfsdfAAAsdfdsfs'; For (var I = 0; i & lt; 1000; i ++) {
    /aaa/.test (s)
    }

    15. 通常の規則で非キャプチャを使用します (? とても速いです

    16. 特定の要素のスタイルを設定します) cssText
    el.style.cssText +=";postion:absolute;"
    を使用する方が簡単です (IE にはこれがないため、position の前の位置を削除することはできません。position は認識されず、他のブラウザーでは認識されません)。この問題があります)

    17. new では、パラメーターがない場合、関数名の後の括弧を削除できます
    new fn()==>new fn
    new Image()==>new Image


    まずこれくらい考えてください、それが間違っていると思ったら、指摘してください

    上記は JavaScript プログラムの最適化の問題に関するものです。記事については、PHP 中国語 Web サイト (www.php.cn) にご注意ください。



    声明:
    この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。