JAvascript汎用ループ遍歴方法forEach

5946 ワード

1つの要素をループすることは開発で最も一般的なニーズの一つであり、フレームワークBASE 2とJqueryの結合バージョンを見てみましょう.
  01 var   forEach = ( function (){ 02      // 03      var   _Array_forEach =  function   (array, block, context) {  04          if   (array ==  null return 05          // String 06          if ( typeof   array ==  'string' ){ 07              array = array.split( '' ); 08          } 09          var   i = 0,length = array.length;  10          for   (;i < length && block.call(context, array[i], (i+1), array)!== false ; i++) {}   11      }; 12      // 13      var   _Function_forEach =  function   (object, block, context) {  14          for   ( var   key  in   object) {  15             //   16             if   (object.hasOwnProperty(key)&&block.call(context, object[key], key, object)=== false ){ 17                  break ; 18             } 19          20      };  21      return   function (object, block, context){ 22          if   (object ==  null return 23          if   ( typeof   object.length ==  "number" ) {  24            _Array_forEach(object, block, context);  25          } else {   26              _Function_forEach(object, block, context);  27          } 28      }; 29 })()
関数自体は複雑ではありませんが、精巧です.简単な注釈をつけて、みんなが理解できることを信じたいです.
 
例を少し見てみましょう01 //1:1  
  2:2
02 forEach([1,2,3,4,5], function (el,index){ 03      if (index>2){ 04          return   false ; 05      } 06      alert(index+ ":" +el); 07 }); 08 09 function   print(el,index){ 10      alert(index+ ":" +el); 11 } 12 //a:a  
  b:b    
  c:c
13 forEach({a: 'a' ,b: 'b' ,c: 'c' },print); 14 15 //1:   
  2:     
  3:     
  4:     
  5:     
  6:
16 forEach( " " ,print); 17        18 function   Person(name, age) {  19    this .name = name ||  "" 20    this .age = age || 0;  21 };  22 Person.prototype =  new   Person;  23 var   fred =  new   Person( " " , 25);  24 fred.language =  "chinese" ; //   25 //name:jxl 
  age:22 
  language:chinese
26 forEach(fred,print);
注意:コールバック関数のindexパラメータの下に1から始まる
 
なぜ内蔵のforEachを使わないのか
getElementsByClassNameと同様に、内蔵のforEachは効率的ですが、機能的に限界があり、ループの途中で退出することはできません.このforEachでは、falseを返すことで処理関数内でループを終了し、より柔軟にすることができます.
特別なlengthプロパティ
length属性はとても特別な属性で、配列を見て、みんなはきっとlengthを思い出して、それではlength属性のオブジェクトを見ますか?では、偽配列(クラス配列)を思い浮かべなければなりません.では、偽の配列とは何ですか.簡単な理解はアリーを通してprototype.sliceは、真の配列のlength属性を持つオブジェクトに変換されます.JAvascriptで最も有名な擬似配列はargumentsオブジェクトです.偽配列についてはいろいろなものがありますが、これからは博文を書いてこれを話します.オブジェクトにlength属性を勝手に与えないでください.明確に知らない限り、偽の配列として使用するつもりです.
 
この関数は簡単なjavascriptツールライブラリの必須関数だと思います.ピラミッドの基礎であり、その基礎の上で、再パッケージを行い、あなたのライブラリをより強く、より美しくすることができます.