Heim > Web-Frontend > js-Tutorial > Javascript-Array-Schleifendurchlauf (forEach ausführliche Erklärung)

Javascript-Array-Schleifendurchlauf (forEach ausführliche Erklärung)

亚连
Freigeben: 2018-05-19 14:17:08
Original
9215 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die detaillierte Erklärung von forEach für das Durchlaufen von Javascript-Arrays vorgestellt. Es ist sehr hilfreich, um forEach zu lernen.

1.js-Array-Schleifendurchlauf.

Array-Schleifenvariable, das erste, was mir in den Sinn kommt, ist for(var i=0;i

Darüber hinaus können Sie auch die einfachere forEach-Methode

2.forEach-Funktion verwenden.

Die Array-Typen von Firefox und Chrome verfügen beide über forEach-Funktionen. Verwenden Sie es wie folgt:

<!--Add by oscar999--> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Author" CONTENT="oscar999"> 
</HEAD> 
 
<BODY> 
<script> 
var arryAll = []; 
arryAll.push(1); 
arryAll.push(2); 
arryAll.push(3); 
arryAll.push(4); 

//匿名方式
arryAll.forEach(function(e){ 
  alert(e); 
}) 

function t1(arg){alert(arg);}
//非匿名方式
arryAll.forEach(t1,arryAll);

</script> 
</BODY> 
</HTML>
Nach dem Login kopieren

Der obige Code funktioniert jedoch im IE nicht ordnungsgemäß.

Da das Array des IE diese Methode nicht hat

alert(Array.prototype.forEach);
Nach dem Login kopieren

Die Ausführung des obigen Satzes führt zu „undefiniert“, was Folgendes bedeutet in Es gibt keine forEach-Methode im Array im IE.

3. Machen Sie den IE mit der forEach-Methode kompatibel

Da das Array des IE keine forEach-Methode hat, werden wir diese Prototypmethode manuell hinzufügen.

//Array.forEach implementation for IE support.. 
//https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Array/forEach 
if (!Array.prototype.forEach) { 
  Array.prototype.forEach = function(callback, thisArg) { 
    var T, k; 
    if (this == null) { 
      throw new TypeError(" this is null or not defined"); 
    } 
    var O = Object(this); 
    var len = O.length >>> 0; // Hack to convert O.length to a UInt32 
    if ({}.toString.call(callback) != "[object Function]") { 
      throw new TypeError(callback + " is not a function"); 
    } 
    if (thisArg) { 
      T = thisArg; 
    } 
    k = 0; 
    while (k < len) { 
      var kValue; 
      if (k in O) { 
        kValue = O[k]; 
        callback.call(T, kValue, k, O); 
      } 
      k++; 
    } 
  }; 
}
Nach dem Login kopieren

Eine ausführliche Einführung finden Sie unter:
https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects /Array/ forEach

4. Wie kann ich aus der Schleife ausbrechen?

Js In diesem Fall kann forEach nicht continue, break verwenden. Sie können die folgenden zwei Methoden verwenden:

1. if-Anweisungssteuerung

2. Return-Anweisungssteuerung (true zurückgeben oder false zurückgeben)

Tatsächlich hat return eine ähnliche Funktion, um fortzufahren

Das Folgende Ein Beispiel besteht darin, die Vielfachen von 2 und 3 im Array herauszunehmen

<!--Add by oscar999--> 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<META NAME="Author" CONTENT="oscar999"> 
</HEAD> 
 
<BODY> 
<script> 
if (!Array.prototype.forEach) { 
  Array.prototype.forEach = function(callback, thisArg) { 
    var T, k; 
    if (this == null) { 
      throw new TypeError(" this is null or not defined"); 
    } 
    var O = Object(this); 
    var len = O.length >>> 0; // Hack to convert O.length to a UInt32 
    if ({}.toString.call(callback) != "[object Function]") { 
      throw new TypeError(callback + " is not a function"); 
    } 
    if (thisArg) { 
      T = thisArg; 
    } 
    k = 0; 
    while (k < len) { 
      var kValue; 
      if (k in O) { 
        kValue = O[k]; 
        callback.call(T, kValue, k, O); 
      } 
      k++; 
    } 
  }; 
} 
 
var arryAll = []; 
arryAll.push(1); 
arryAll.push(2); 
arryAll.push(3); 
arryAll.push(4); 
arryAll.push(5);
arryAll.push(6); 
arryAll.push(7); 
 
 
var arrySpecial = []; 
 
arryAll.forEach(function(e){ 
  if(e%2==0) 
  { 
    arrySpecial.push(e); 
  }else if(e%3==0) 
  { 
    arrySpecial.push(e); 
  } 
}) 
 
</script> 
</BODY> 
</HTML>
Nach dem Login kopieren

Verwenden Sie return, um das oben Gesagte zu erreichen effect

arryAll.forEach(function(e){ 
  if(e%2==0) 
  { www.jb51.net
    arrySpecial.push(e); 
    return; 
  } 
  if(e%3==0) 
  {   
    arrySpecial.push(e); 
    return; 
  } 
})
Nach dem Login kopieren

Was das Schreiben eines Effekts ähnlich wie break angeht, gibt es noch keinen besseren Weg.

Persönliche Meinung: Ob in Java- oder C#-Syntax, forEach soll alle Werte durchlaufen

Ich habe gesucht und einige sagten, dass die Rückgabe „false“ erreicht werden kann Wenn es sich um einen Versuch handelt, ist der Effekt von „return false“ derselbe wie „return“ und der Effekt von „return true“ ist derselbe.
Der folgende Testcode wurde von mir selbst hinzugefügt.

var arryAll = []; 
arryAll.push(1); 
arryAll.push(2); 
arryAll.push(3); 
arryAll.push(4); 
arryAll.push(5);
arryAll.push(6);
arryAll.push(7);

arryAll.forEach(function(e){
alert(e);
if(e>3)
return false;
});
Nach dem Login kopieren

Das oben Gesagte habe ich für Sie zusammengestellt. Ich hoffe, es wird Ihnen in Zukunft hilfreich sein.

Verwandte Artikel:

js-Code zum Durchlaufen der Eigenschaften der object_javascript-Fähigkeiten

JS-Code zum Durchlaufen von DOM-Instanzen

JS-Code zum Durchlaufen der Attribute von Objekten

Das obige ist der detaillierte Inhalt vonJavascript-Array-Schleifendurchlauf (forEach ausführliche Erklärung). Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage