ホームページ  >  記事  >  ウェブフロントエンド  >  JavaScriptでforループを使用する場合の注意点

JavaScriptでforループを使用する場合の注意点

巴扎黑
巴扎黑オリジナル
2017-08-22 11:11:541763ブラウズ


同じコードを毎回異なる値で何度も実行する場合は、ループを使用すると便利です。

for ループを使用することが多く、for ループ部門はよく次のように記述します:

// 次佳的循环
for (var i = 0; i < myarray.length; i++) {
 // 使用myarray[i]做点什么}

このようなコードには大きな問題はありませんが、ループするたびに次の長さが取得されます。配列、特に myarray が配列ではなく HTMLCollection オブジェクトである場合、今回はコードを削減します。

次のコードをもう一度見てください:

for (var i = 0, max = myarray.length; i < max; i++) {
 // 使用myarray[i]做点什么}

このコードは配列の長さを 1 回だけ取得するため、コードの品質が向上します。

単一の var 形式を使用すると、ループから変数を取り出すことができます。 like 以下は次のとおりです:

function looper() {
 var i = 0,
  max,
  myarray = [];
 // ...
 for (i = 0, max = myarray.length; i < max; i++) {
  // 使用myarray[i]做点什么
 }}

JavaScript が for ループを使用する場合の問題の概要

この問題の議論はもともと会社の内部メールから来たもので、この問題の議論を記録したところです。

一部のプロジェクト チームは、"for(x in array)" を使用すると、IE ブラウザーで x に予期しない値が表示されるという問題を発見しました。

具体的には、Array.prototype.indexOfメソッドがカスタマイズされている場合(たとえば、特定のプロトタイプ汚染が原因)、古いバージョンのIEブラウザがarray.indexOfメソッドをサポートしていないことが原因である可能性があり、開発者はそれを使用したい場合、そのようなブラウザには次の問題が発生する可能性があります:

Array.prototype.indexOf = function(){...};
var arr = [1, 2];for (x in arr) console.log(x);

//は

1
2function(){…}

を出力します。つまり、 indexOf メソッドが出力されます。

解決策は非常に簡単で、このメソッドを追加しないか、「for (i=0; i などのようなループを使用します。

しかし、問題の本質は何でしょうか? for(x in obj) の使用法は実際にはオブジェクトを走査するためであり、配列の実装は、key が単に確立されたものであることを除いて、実際には通常のオブジェクトの実装と同じであるためではないかと推測する人もいます。 value:

{0:"something", 1:"something else"}

配列を走査するときの for...in と for(;;) の使用には違いがあることも stackoverflow の質問と回答で述べられています。前者はオブジェクトのプロパティを列挙することを意味します。

列挙の順序は保証できません;

継承されたプロパティも列挙されます

Array.prototype.forEach

のサポートに関しては、IE8 と以下は正確にサポートできません: forEach メソッドの互換性の詳細な説明もここにあります。実際、主要な JavaScript フレームワーク (jQuery、Underscore、Prototype など) にはすべて、for-each 機能の安全で一般的な実装があります。

JSLint の for in の章でも、for in ステートメントではオブジェクトの属性名をループすることができますが、プロトタイプ チェーンを通じて継承された属性もトラバースするため、多くの場合予期しないエラーが発生することについても説明されています。大まかな解決策があります:

for (name in object)
 { if (object.hasOwnProperty(name))
 { .... } }

このループと同様の

for(var i=0;i の使用の問題について言及している人もいます。これは、JavaScript にはコード ブロック レベルの変数がないためです。 i のアクセス許可は、実際にはそれが配置されているメソッドです。一部の本では、そのような変数宣言を 1 か所にまとめるようプログラマにアドバイスしていますが、直感的に言えば、ほとんどの場合、それは十分合理的ではありません。 JavaScript 1.7 で導入された "let" を使用すると、この問題を解決でき、i を実際のコード ブロック レベルの変数にすることができます:
for(let i =0; i < a.length; i++)

最後に、この制約は Google の JavaScript スタイル ガイドにも含まれています:

for-in loop:
Only for iterating over keys in an object/map/hash

上記は、の内容全体です。この記事は、JavaScript で for ループを使用する際に注意すべき問題についてまとめたもので、今後の作業や研究に役立つことを願っています。業界関係者からの批判や提案を歓迎します。

以上がJavaScriptでforループを使用する場合の注意点の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

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