var myStringArray = ["Hello","World"];
var arrayLength = myStringArray.length;
for (var i = 0; i < arrayLength; i++) {
    console.log(myStringArray[i]);
    //Do something
}

Antwoord 2, autoriteit 26%

Ja, ervan uitgaande dat uw implementatie de for…of-functie geïntroduceerd in ECMAScript 2015 (de “Harmony”-release)… wat tegenwoordig een redelijk veilige veronderstelling is.

Het werkt als volgt:

// REQUIRES ECMASCRIPT 2015+
var s, myStringArray = ["Hello", "World"];
for (s of myStringArray) {
  // ... do something with s ...
}

Of beter nog, aangezien ECMAScript 2015 ook variabelen met blokbereik biedt:

// REQUIRES ECMASCRIPT 2015+
const myStringArray = ["Hello", "World"];
for (const s of myStringArray) {
  // ... do something with s ...
}
// s is no longer defined here

(De variabele s is bij elke iteratie anders, maar kan nog steeds als const worden gedeclareerd binnen de lus, zolang deze daar niet wordt gewijzigd.)

p>

Een opmerking over schaarse arrays: een array in JavaScript kan in feite niet zoveel items opslaan als gerapporteerd door zijn length; dat gerapporteerde getal is gewoon één groter dan de hoogste index waarbij een waarde is opgeslagen. Als de array minder elementen bevat dan aangegeven door de lengte, wordt er gezegd dat het sparse is. Het is bijvoorbeeld volkomen legitiem om een ​​array te hebben met alleen items op indexen 3, 12 en 247; de length van zo’n array wordt gerapporteerd als 248, hoewel het eigenlijk maar 3 waarden opslaat. Als u probeert toegang te krijgen tot een item in een andere index, lijkt de array daar de waarde undefined te hebben. Dus als u een array wilt “doorlussen”, moet u een vraag beantwoorden: wilt u het volledige bereik doorlopen dat wordt aangegeven door de lengte en undefineds verwerken voor ontbrekende elementen, of u wilt alleen de werkelijk aanwezige elementen verwerken? Er zijn tal van toepassingen voor beide benaderingen; het hangt er gewoon van af waar je de array voor gebruikt.

Als u een array herhaalt met for..of, wordt de hoofdtekst van de lus length keer uitgevoerd en wordt de lusbesturing variabele is ingesteld op undefined voor alle items die niet daadwerkelijk in de array aanwezig zijn. Afhankelijk van de details van uw “doe iets met”-code, kan dat gedrag zijn wat u wilt, maar als dat niet het geval is, moet u een andere aanpak gebruiken.

Natuurlijk hebben sommige ontwikkelaars geen andere keuze dan een andere aanpak te gebruiken, omdat ze om wat voor reden dan ook een versie van JavaScript targeten die for nog niet ondersteunt…of.

Zolang uw JavaScript-implementatie voldoet aan de vorige editie van de ECMAScript-specificatie (die bijvoorbeeld versies van Internet Explorer vóór 9 uitsluit), kunt u de Array#forEach iterator methode in plaats van een lus. In dat geval geef je een functie door die moet worden aangeroepen voor elk item in de array:

var myStringArray = [ "Hello", "World" ];
myStringArray.forEach( function(s) { 
     // ... do something with s ...
} );

In tegenstelling tot for…of, roept .forEach de functie alleen aan voor elementen die daadwerkelijk in de array aanwezig zijn. Als onze hypothetische array met drie elementen en een lengte van 248 wordt doorgegeven, zal deze de functie slechts drie keer aanroepen, niet 248 keer. Het maakt ook onderscheid tussen ontbrekende elementen en elementen die daadwerkelijk zijn ingesteld op undefined; voor de laatste zal het nog steeds de functie aanroepen, waarbij undefined als argument wordt doorgegeven. Als u op deze manier met schaarse arrays wilt omgaan, is .forEach wellicht de juiste keuze, zelfs als uw tolk for…of ondersteunt. .

De laatste optie, die werkt in alle versies van JavaScript, is een expliciete tellus. Je telt gewoon van 0 tot één minder dan de lengte en gebruikt de teller als index. De basislus ziet er als volgt uit:

var i, s, myStringArray = [ "Hello", "World" ], len = myStringArray.length;
for (i=0; i<len; ++i) {
  s = myStringArray[i];
  // ... do something with s ...
}

Een voordeel van deze aanpak is dat je kunt kiezen hoe je met schaarse arrays omgaat; de bovenstaande code voert de hoofdtekst van de lus de volledige length keer uit, met s ingesteld op undefined voor ontbrekende elementen, net als for..of. Als u in plaats daarvan alleen de daadwerkelijk aanwezige elementen van een schaarse array wilt verwerken, zoals .forEach, kunt u een eenvoudige in-test toevoegen aan de index:

var i, s, myStringArray = [ "Hello", "World" ], len = myStringArray.length;
for (i=0; i<len; ++i) {
  if (i in myStringArray) {
    s = myStringArray[i];
    // ... do something with s ...
  }
}

Het toewijzen van de lengtewaarde aan de lokale variabele (in tegenstelling tot het opnemen van de volledige myStringArray.length-expressie in de lusvoorwaarde) kan een aanzienlijk verschil maken in de prestaties, aangezien het elke keer een eigenschapsopzoeking overslaat. ; als ik Rhino op mijn machine gebruik, is de versnelling 43%.

Mogelijk ziet u de caching van de lengte gedaan in de lus-initialisatieclausule, als volgt:

var i, len, myStringArray = [ "Hello", "World" ];
for (len = myStringArray.length, i=0; i<len; ++i) {

De expliciete tellus betekent ook dat je toegang hebt tot de index van elke waarde, mocht je dat willen. De index wordt ook als een extra parameter doorgegeven aan de functie die je doorgeeft aan forEach, zodat je er ook op die manier toegang toe hebt:

myStringArray.forEach( function(s, i) {
   // ... do something with s and i ...
});

for…of geeft u niet de index die bij elk object hoort, maar zolang het object waarover u itereert in feite een Array (for..of werkt voor andere itereerbare typen die deze methode mogelijk niet hebben), kunt u de Array#entries methode om het te veranderen in een array van [index, item ] paren, en herhaal dat dan:

for (const [i, s] of myStringArray.entries()) {
  // ... do something with s and i ...
}

De for…in syntaxis die door anderen wordt genoemd, is voor het doorlopen van de eigenschappen van een object; aangezien een array in JavaScript slechts een object is met numerieke eigenschapsnamen (en een automatisch bijgewerkte eigenschap length), kun je er theoretisch een array mee doorlopen. Maar het probleem is dat het zich niet beperkt tot de numerieke eigenschapswaarden (onthoud dat zelfs methoden eigenlijk gewoon eigenschappen zijn waarvan de waarde een afsluiting is), en het is ook niet gegarandeerd dat het deze in numerieke volgorde herhaalt. Daarom moet de syntaxis for…in niet worden gebruikt voor het doorlopen van arrays.

Antwoord 3, autoriteit 10%

Je kunt map gebruiken, een functionele programmeertechniek die ook beschikbaar is in andere talen, zoals Python en Haskell.

[1,2,3,4].map( function(item) {
     alert(item);
})

De algemene syntaxis is:

array.map(func)

In het algemeen zou func één parameter nemen, wat een item van de array is. Maar in het geval van JavaScript kan er een tweede parameter voor nodig zijn, namelijk de index van het item, en een derde parameter, de array zelf.

De retourwaarde van array.map is een andere array, dus je kunt deze als volgt gebruiken:

var x = [1,2,3,4].map( function(item) {return item * 10;});

En nu is x [10,20,30,40].

Je hoeft de functie niet inline te schrijven. Het zou een aparte functie kunnen zijn.

var item_processor = function(item) {
      // Do something complicated to an item
}
new_list = my_list.map(item_processor);

wat ongeveer gelijk zou zijn aan:

 for (item in my_list) {item_processor(item);}

Behalve dat je de new_list niet krijgt.

Antwoord 4, autoriteit 3%

voor (const s van myStringArray) {

(Directe beantwoording van uw vraag: nu kan dat!)

De meeste andere antwoorden zijn juist, maar ze vermelden (op het moment van schrijven) niet dat ECMAScript 6 2015 een nieuw mechanisme voor iteratie, de for..of lus.

Deze nieuwe syntaxis is de meest elegante manier om een ​​array in JavaScript te herhalen (zolang u de iteratie-index niet nodig heeft).

Het werkt momenteel met Firefox 13+, Chrome 37+ en het werkt niet standaard met andere browsers (zie browsercompatibiliteit hieronder). Gelukkig hebben we JavaScript-compilers (zoals Babel) waarmee we de volgende generatie functies kunnen gebruiken.

Het werkt ook op Node.js (ik heb het getest op versie 0.12.0).

Een array herhalen

// You could also use "let" or "const" instead of "var" for block scope.
for (var letter of ["a", "b", "c"]) {
   console.log(letter);
}

Een reeks objecten herhalen

const band = [
  {firstName : 'John', lastName: 'Lennon'},
  {firstName : 'Paul', lastName: 'McCartney'}
];
for(const member of band){
  console.log(member.firstName + ' ' + member.lastName);
}

Een generator herhalen:

(voorbeeld geëxtraheerd uit https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/for…of)

function* fibonacci() { // A generator function
  let [prev, curr] = [1, 1];
  while (true) {
    [prev, curr] = [curr, prev + curr];
    yield curr;
  }
}
for (const n of fibonacci()) {
  console.log(n);
  // Truncate the sequence at 1000
  if (n >= 1000) {
    break;
  }
}

Compatibiliteitstabel:
http://kangax.github.io/es5-compat-table/es6/#For ..van lussen

Specificatie: http://wiki.ecmascript .org/doku.php?id=harmony:iterators

}

Antwoord 5, autoriteit 3%

In JavaScript is het niet raadzaam om een ​​array met een for-in-lus te doorlopen, maar het is beter om een ​​for-lus te gebruiken, zoals:

for(var i=0, len=myArray.length; i < len; i++){}

Het is ook geoptimaliseerd (“caching” van de arraylengte). Als je meer wilt weten, lees mijn bericht over dit onderwerp.

Antwoord 6, autoriteit 2%

Opera, Safari, Firefox en Chrome delen nu allemaal een reeks verbeterde array-methoden voor het optimaliseren van veel algemene loops.

Je hebt ze misschien niet allemaal nodig, maar ze kunnen erg handig zijn, of zou het zijn als elke browser ze zou ondersteunen.

Mozilla Labs heeft de algoritmen gepubliceerd die zij en WebKit beide gebruiken, zodat u ze zelf kunt toevoegen .

filter retourneert een reeks items die aan een bepaalde voorwaarde of test voldoen.

every retourneert true als elk arraylid de test doorstaat.

sommige retourneert waar als er een is geslaagd voor de test.

forEach voert een functie uit op elk arraylid en retourneert niets.

map is als forEach, maar het retourneert een array van de resultaten van de bewerking voor elk element.

Deze methoden nemen allemaal een functie voor hun eerste argument en hebben een optioneel tweede argument, wat een object is waarvan u de reikwijdte wilt opleggen aan de arrayleden terwijl ze door de functie lopen.

Negeer het totdat je het nodig hebt.

indexOf en lastIndexOf vinden de juiste positie van het eerste of laatste element dat exact overeenkomt met het argument.

(function(){
    var p, ap= Array.prototype, p2={
        filter: function(fun, scope){
            var L= this.length, A= [], i= 0, val;
            if(typeof fun== 'function'){
                while(i< L){
                    if(i in this){
                        val= this[i];
                        if(fun.call(scope, val, i, this)){
                            A[A.length]= val;
                        }
                    }
                    ++i;
                }
            }
            return A;
        },
        every: function(fun, scope){
            var L= this.length, i= 0;
            if(typeof fun== 'function'){
                while(i<L){
                    if(i in this && !fun.call(scope, this[i], i, this))
                        return false;
                    ++i;
                }
                return true;
            }
            return null;
        },
        forEach: function(fun, scope){
            var L= this.length, i= 0;
            if(typeof fun== 'function'){
                while(i< L){
                    if(i in this){
                        fun.call(scope, this[i], i, this);
                    }
                    ++i;
                }
            }
            return this;
        },
        indexOf: function(what, i){
            i= i || 0;
            var L= this.length;
            while(i< L){
                if(this[i]=== what)
                    return i;
                ++i;
            }
            return -1;
        },
        lastIndexOf: function(what, i){
            var L= this.length;
            i= i || L-1;
            if(isNaN(i) || i>= L)
                i= L-1;
            else
                if(i< 0) i += L;
            while(i> -1){
                if(this[i]=== what)
                    return i;
                --i;
            }
            return -1;
        },
        map: function(fun, scope){
            var L= this.length, A= Array(this.length), i= 0, val;
            if(typeof fun== 'function'){
                while(i< L){
                    if(i in this){
                        A[i]= fun.call(scope, this[i], i, this);
                    }
                    ++i;
                }
                return A;
            }
        },
        some: function(fun, scope){
            var i= 0, L= this.length;
            if(typeof fun== 'function'){
                while(i<L){
                    if(i in this && fun.call(scope, this[i], i, this))
                        return true;
                    ++i;
                }
                return false;
            }
        }
    }
    for(p in p2){
        if(!ap[p])
            ap[p]= p2[p];
    }
    return true;
})();

Antwoord 7, autoriteit 2%

Inleiding

Sinds mijn studietijd programmeer ik in Java, JavaScript, Pascal, ABAP , PHP, Progress 4GL, C/C++ en mogelijk een paar andere talen die ik niet kan bedenken nu.

Hoewel ze allemaal hun eigen taalkundige eigenaardigheden hebben, delen al deze talen veel van dezelfde basisconcepten. Dergelijke concepten omvatten procedures / functies, IF-statements, for-loops en while-loops.

Een traditionele for-loop

Een traditionele for-lus heeft drie componenten:

1. De initialisatie: uitgevoerd voordat het zoekblok de eerste keer wordt uitgevoerd
2. De voorwaarde: controleert elke keer een voorwaarde voordat het lusblok wordt uitgevoerd, en sluit de lus af als deze niet waar is
3. De bijzaak: wordt elke keer uitgevoerd nadat het lusblok is uitgevoerd

Deze drie componenten worden van elkaar gescheiden door een ; symbool. Inhoud voor elk van deze drie componenten is optioneel, wat betekent dat het volgende de meest minimale for-lus is die mogelijk is:

for (;;) {
    // Do stuff
}

Natuurlijk moet je een if(condition === true) { break; } of een if(condition === true) { return; } ergens binnen die for-lus om het te laten stoppen met draaien.

Gewoonlijk wordt de initialisatie echter gebruikt om een ​​index te declareren, de voorwaarde wordt gebruikt om die index te vergelijken met een minimum- of maximumwaarde, en de nabeschouwing wordt gebruikt om de index te verhogen:

for (var i = 0, length = 10; i < length; i++) {
    console.log(i);
}

Een traditionele for lus gebruiken om door een array te lussen

De traditionele manier om door een array te lussen, is deze:

for (var i = 0, length = myArray.length; i < length; i++) {
    console.log(myArray[i]);
}

Of, als je er de voorkeur aan geeft achteruit te lussen, doe je dit:

for (var i = myArray.length - 1; i > -1; i--) {
    console.log(myArray[i]);
}

Er zijn echter veel variaties mogelijk, zoals bijvoorbeeld deze:

for (var key = 0, value = myArray[key], length = myArray.length; key < length; value = myArray[++key]) {
    console.log(value);
}

…of deze…

var i = 0, length = myArray.length;
for (; i < length;) {
    console.log(myArray[i]);
    i++;
}

…of deze:

var key = 0, value;
for (; value = myArray[key++];){
    console.log(value);
}

Wat het beste werkt, is grotendeels een kwestie van zowel persoonlijke smaak als de specifieke gebruikssituatie die u implementeert.

Houd er rekening mee dat elk van deze varianten door alle browsers wordt ondersteund, inclusief heel erg oude!

Een while-lus

Een alternatief voor een for-lus is een while-lus. Om een ​​array te doorlopen, kunt u dit doen:

var key = 0;
while(value = myArray[key++]){
    console.log(value);
}

Net als traditionele for loops, worden while loops zelfs door de oudste browsers ondersteund.

Houd er ook rekening mee dat elke while-lus kan worden herschreven als een for-lus. Bijvoorbeeld, de while lus hierboven gedraagt ​​zich exact hetzelfde als deze for-lus:

for(var key = 0; value = myArray[key++];){
    console.log(value);
}

for...in en for...of

In JavaScript kunt u dit ook doen:

for (i in myArray) {
    console.log(myArray[i]);
}

Dit moet echter met zorg worden gebruikt, aangezien het zich niet in alle gevallen hetzelfde gedraagt ​​als een traditionele for-lus, en er zijn mogelijke bijwerkingen waarmee rekening moet worden gehouden. Zie Waarom wordt &quot gebruikt ;voor…in" voor array-iteratie een slecht idee? voor meer details.

Als alternatief voor for...in is er nu ook voor for...of. Het volgende voorbeeld toont het verschil tussen een for...of-lus en een for...in-lus:

var myArray = [3, 5, 7];
myArray.foo = "hello";
for (var i in myArray) {
  console.log(i); // logs 0, 1, 2, "foo"
}
for (var i of myArray) {
  console.log(i); // logs 3, 5, 7
}

Bovendien moet u er rekening mee houden dat geen enkele versie van Internet Explorer for...of ondersteunt (Edge 12+ doet) en dat for...in vereist minimaal Internet Explorer 10.

Array.prototype.forEach()

Een alternatief voor for-loops is Array.prototype.forEach(), die de volgende syntaxis gebruikt:

myArray.forEach(function(value, key, myArray) {
    console.log(value);
});

Array.prototype.forEach() wordt ondersteund door alle moderne browsers, evenals Internet Explorer 9 en hoger.

Bibliotheken

Ten slotte hebben veel hulpprogrammabibliotheken ook hun eigen forEach-variant. AFAIK, de drie meest populaire zijn deze:

jQuery.each(), in jQuery:

$.each(myArray, function(key, value) {
    console.log(value);
});

_.each(), in Underscore.js:

_.each(myArray, function(value, key, myArray) {
    console.log(value);
});

_.forEach(), in Lodash:

_.forEach(myArray, function(value, key) {
    console.log(value);
});

Antwoord 8, autoriteit 2%

Gebruik de while-lus…

var i = 0, item, items = ['one', 'two', 'three'];
while(item = items[i++]){
    console.log(item);
}

Het logt: ‘één’, ‘twee’ en ‘drie’

En voor de omgekeerde volgorde, een nog efficiëntere lus:

var items = ['one', 'two', 'three'], i = items.length;
while(i--){
    console.log(items[i]);
}

Het logt: ‘drie’, ‘twee’ en ‘één’

Of de klassieke for-lus:

var items = ['one', 'two', 'three']
for(var i=0, l = items.length; i < l; i++){
    console.log(items[i]);
}

Het logt: ‘één’,’twee’,’drie’

Referentie: Google Sluiting: hoe niet JavaScript schrijven

Antwoord 9

Als je een beknopte manier wilt om een ​​snelle lus te schrijven en je in omgekeerde volgorde kunt herhalen:

for (var i=myArray.length;i--;){
  var item=myArray[i];
}

Dit heeft het voordeel dat de lengte in de cache wordt opgeslagen (vergelijkbaar met for (var i=0, len=myArray.length; i<len; ++i) en in tegenstelling tot for (var i=0; i<myArray.length; ++i)) terwijl er minder tekens hoeven te worden getypt.

Er zijn zelfs momenten waarop je in omgekeerde volgorde zou moeten herhalen, zoals bij het herhalen van een live NodeList waar je tijdens iteratie items uit de DOM wilt verwijderen.

Antwoord 10

Enkele gevallen van doorlussen door een array op de functionele programmeermanier in JavaScript:

1. Loop gewoon door een array

const myArray = [{x:100}, {x:200}, {x:300}];
myArray.forEach((element, index, array) => {
    console.log(element.x); // 100, 200, 300
    console.log(index); // 0, 1, 2
    console.log(array); // same myArray object 3 times
});

Opmerking: Array.prototype.forEach() is strikt genomen geen functionele manier, omdat de functie die het als invoerparameter nodig heeft, geen waarde moet retourneren, wat dus niet als een pure functie kan worden beschouwd.

>

2. Controleer of een van de elementen in een array een test doorstaat

const people = [
    {name: 'John', age: 23}, 
    {name: 'Andrew', age: 3}, 
    {name: 'Peter', age: 8}, 
    {name: 'Hanna', age: 14}, 
    {name: 'Adam', age: 37}];
const anyAdult = people.some(person => person.age >= 18);
console.log(anyAdult); // true

3. Transformeren naar een nieuwe array

const myArray = [{x:100}, {x:200}, {x:300}];
const newArray= myArray.map(element => element.x);
console.log(newArray); // [100, 200, 300]

Opmerking: de methode map() maakt een nieuwe array aan met het resultaat van het aanroepen van een opgegeven functie op elk element in de aanroepende array.

4. Som een ​​bepaalde eigenschap op en bereken het gemiddelde

const myArray = [{x:100}, {x:200}, {x:300}];
const sum = myArray.map(element => element.x).reduce((a, b) => a + b, 0);
console.log(sum); // 600 = 0 + 100 + 200 + 300
const average = sum / myArray.length;
console.log(average); // 200

5. Maak een nieuwe array op basis van het origineel, maar zonder deze te wijzigen

const myArray = [{x:100}, {x:200}, {x:300}];
const newArray= myArray.map(element => {
    return {
        ...element,
        x: element.x * 2
    };
});
console.log(myArray); // [100, 200, 300]
console.log(newArray); // [200, 400, 600]

6. Tel het aantal van elke categorie

const people = [
    {name: 'John', group: 'A'}, 
    {name: 'Andrew', group: 'C'}, 
    {name: 'Peter', group: 'A'}, 
    {name: 'James', group: 'B'}, 
    {name: 'Hanna', group: 'A'}, 
    {name: 'Adam', group: 'B'}];
const groupInfo = people.reduce((groups, person) => {
    const {A = 0, B = 0, C = 0} = groups;
    if (person.group === 'A') {
        return {...groups, A: A + 1};
    } else if (person.group === 'B') {
        return {...groups, B: B + 1};
    } else {
        return {...groups, C: C + 1};
    }
}, {});
console.log(groupInfo); // {A: 3, C: 1, B: 2}

7. Een subset van een array ophalen op basis van bepaalde criteria

const myArray = [{x:100}, {x:200}, {x:300}];
const newArray = myArray.filter(element => element.x > 250);
console.log(newArray); // [{x:300}] 

Opmerking: de filter()-methode maakt een nieuwe array aan met alle elementen die de test doorstaan ​​die is geïmplementeerd door de geleverde functie.

8. Sorteer een array

const people = [
  { name: "John", age: 21 },
  { name: "Peter", age: 31 },
  { name: "Andrew", age: 29 },
  { name: "Thomas", age: 25 }
];
let sortByAge = people.sort(function (p1, p2) {
  return p1.age - p2.age;
});
console.log(sortByAge);

9. Zoek een element in een array

const people = [ {name: "john", age:23},
                {name: "john", age:43},
                {name: "jim", age:101},
                {name: "bob", age:67} ];
const john = people.find(person => person.name === 'john');
console.log(john);

De methode Array.prototype.find() retourneert de waarde van het eerste element in de array dat voldoet aan de opgegeven testfunctie.

Referenties

• Array.prototype.some()
• Array.prototype.forEach()
• Array.prototype.map()
• Array.prototype.filter()
• Array.prototype.sort()
• Spread-syntaxis
• Array.prototype.find()

Antwoord 11

Ja, u kunt hetzelfde doen in JavaScript met behulp van een lus, maar niet beperkt daartoe. Er zijn veel manieren om een ​​lus te maken over arrays in JavaScript. Stel je voor dat je deze array hieronder hebt, en je zou er een lus over willen maken:

var arr = [1, 2, 3, 4, 5];

Dit zijn de oplossingen:

1) For-lus

Een for-lus is een gebruikelijke manier om arrays in JavaScript te doorlopen, maar wordt niet beschouwd als de snelste oplossing voor grote arrays:

for (var i=0, l=arr.length; i<l; i++) {
  console.log(arr[i]);
}

2) While-lus

Een while-lus wordt beschouwd als de snelste manier om lange arrays te doorlopen, maar wordt meestal minder gebruikt in de JavaScript-code:

let i=0;
while (arr.length>i) {
    console.log(arr[i]);
    i++;
}

3) Doe terwijl
Een do while doet hetzelfde als while met een syntaxisverschil zoals hieronder:

let i=0;
do {
  console.log(arr[i]);
  i++;
}
while (arr.length>i);

Dit zijn de belangrijkste manieren om JavaScript-loops te maken, maar er zijn nog een paar manieren om dat te doen.

We gebruiken ook een for in-lus voor het doorlopen van objecten in JavaScript.

Kijk ook naar de map(), filter(), reduce(), etc. functies op een array in JavaScript. Ze kunnen dingen veel sneller en beter doen dan while en for te gebruiken.

Dit is een goed artikel als je meer wilt weten over de asynchrone functies over arrays in JavaScript.

Functioneel programmeren maakt nogal wat los in de
ontwikkelingswereld tegenwoordig. En niet voor niets: Functioneel
technieken kunnen u helpen meer declaratieve code te schrijven die gemakkelijker te
in één oogopslag begrijpen, refactoren en testen.

Een van de hoekstenen van functioneel programmeren is het speciale gebruik ervan
van lijsten en lijstbewerkingen. En die dingen zijn precies wat de
klinken alsof ze zijn: arrays van dingen en de dingen die je ermee doet.
Maar de functionele mindset behandelt hen een beetje anders dan jij
zou verwachten.

In dit artikel wordt nader ingegaan op wat ik de “grote” noem
drie" lijstbewerkingen: in kaart brengen, filteren en verkleinen. Je hoofd wikkelen
rond deze drie functies is een belangrijke stap naar het kunnen
om schone functionele code te schrijven, en opent de deuren naar de enorm
krachtige technieken van functioneel en reactief programmeren.

Het betekent ook dat je nooit meer een for-lus hoeft te schrijven.

Lees meer>> hier:

Antwoord 12

Er is een manier om het te doen waarbij je heel weinig impliciete reikwijdte in je lus hebt en extra variabelen weglaat.

var i = 0,
     item;
// Note this is weak to sparse arrays or falsey values
for ( ; item = myStringArray[i++] ; ){
    item; // This is the string at the index.
}

Of als je echt de id wilt krijgen en een echt klassieke for-lus wilt hebben:

var i = 0,
    len = myStringArray.length; // Cache the length
for ( ; i < len ; i++ ){
    myStringArray[i]; // Don't use this if you plan on changing the length of the array
}

Moderne browsers ondersteunen allemaal iteratormethoden forEach, map, reduce, filter en tal van andere methoden op de Array-prototype.

Antwoord 13

Er zijn verschillende manieren om arrays in JavaScript te doorlopen.

Algemene lus:

var i;
for (i = 0; i < substr.length; ++i) {
    // Do something with `substr[i]`
}

ES5’s voor elk:

substr.forEach(function(item) {
    // Do something with `item`
});

jQuery.each:

jQuery.each(substr, function(index, item) {
    // Do something with `item` (or `this` is also `item` if you like)
});

Bekijk dit voor gedetailleerde informatie of u kunt ook controleer MDN voor doorlussen een array in JavaScript & gebruik jQuery en controleer jQuery voor elk.

Antwoord 14

Array-lus:

for(var i = 0; i < things.length; i++){
    var thing = things[i];
    console.log(thing);
}

Objectlus:

for(var prop in obj){
    var propValue = obj[prop];
    console.log(propValue);
}

Antwoord 15

Ik zou het ten zeerste aanbevelen om gebruik te maken van de Underscore.js bibliotheek. Het biedt u verschillende functies die u kunt gebruiken om arrays/verzamelingen te doorlopen.

Bijvoorbeeld:

_.each([1, 2, 3], function(num){ alert(num); });
=> alerts each number in turn...

Antwoord 16

Als iemand geïnteresseerd is in de prestatiekant van de meerdere mechanismen die beschikbaar zijn voor array-iteraties, heb ik de volgende JSPerf-tests voorbereid:

https://jsperf.com/fastest-array-iterator

Resultaten:

De traditionele for() iterator is verreweg de snelste methode, vooral wanneer deze wordt gebruikt met de array lengte in de cache.

let arr = [1,2,3,4,5];
for(let i=0, size=arr.length; i<size; i++){
    // Do something
}

De Array.prototype.forEach() en de Array.prototype.map() methoden zijn de langzaamste benaderingen, waarschijnlijk als gevolg van de functie oproepoverhead.

Antwoord 17

Als je de jQuery-bibliotheek gebruikt, overweeg dan om
http://api.jquery.com/jQuery.each/

Uit de documentatie:

jQuery.each( collection, callback(indexInArray, valueOfElement) )

Retouren: Object

Beschrijving: Een generieke iteratorfunctie, die kan worden gebruikt om:
naadloos herhalen over zowel objecten als arrays. Arrays en array-achtige
objecten met een eigenschap length (zoals een object met argumenten van een functie)
worden herhaald door numerieke index, van 0 tot lengte-1. Andere objecten zijn:
herhaald via hun benoemde eigenschappen.

De functie $.each() is niet hetzelfde als $(selector).each(), wat
gebruikt om uitsluitend over een jQuery-object te itereren. De $.each()
functie kan worden gebruikt om elke verzameling te herhalen, of het nu een
map (JavaScript-object) of een array. In het geval van een array, de
callback krijgt elk een array-index en een bijbehorende array-waarde
tijd. (De waarde is ook toegankelijk via het trefwoord this, maar
Javascript zal de waarde this altijd inpakken als een Object, zelfs als dat zo is
een eenvoudige tekenreeks- of getalwaarde.) De methode retourneert de eerste
argument, het object dat werd herhaald.

Antwoord 18

Ik heb deze variant, die ik persoonlijk het mooist vind, nog niet gezien:

Gegeven een array:

var someArray = ["some", "example", "array"];

Je kunt eroverheen lopen zonder ooit de eigenschap length te gebruiken:

for (var i=0, item; item=someArray[i]; i++) {
  // item is "some", then "example", then "array"
  // i is the index of item in the array
  alert("someArray[" + i + "]: " + item);
}

Zie deze JsFiddle die aantoont dat: http://jsfiddle.net/prvzk/

Dit werkt alleen voor arrays die niet schaars zijn. Dit betekent dat er in feite een waarde is bij elke index in de array. Ik ontdekte echter dat ik in de praktijk bijna nooit schaarse arrays in JavaScript gebruik… In dergelijke gevallen is het meestal een stuk eenvoudiger om een ​​object als kaart/hashtabel te gebruiken. Als je een schaarse array hebt en je wilt een loop over 0 .. lengte-1 hebben, dan heb je de constructie for (var i=0; i<someArray.length; ++i) nodig, maar je hebt nog steeds een if in de lus om te controleren of het element in de huidige index daadwerkelijk is gedefinieerd.

Ook, zoals CMS vermeldt in een opmerking hieronder, kunt u dit alleen gebruiken voor arrays die geen valse waarden bevatten. De array van strings uit het voorbeeld werkt, maar als je lege strings hebt, of getallen die 0 of NaN zijn, enz. zal de lus voortijdig afbreken. Nogmaals, in de praktijk is dit voor mij bijna nooit een probleem, maar het is iets om in gedachten te houden, waardoor dit een lus is om over na te denken voordat je het gebruikt… Dat kan het voor sommige mensen diskwalificeren 🙂

Wat ik leuk vind aan deze lus is:

• Het is kort om te schrijven
• Geen toegang nodig tot (laat staan ​​cache) tot de eigenschap length
• Het item waartoe toegang moet worden verkregen, wordt automatisch gedefinieerd binnen de lus
  body onder de naam die je kiest.
• Combineert heel natuurlijk met array.push en array.splice om arrays zoals lijsten/stacks te gebruiken

De reden dat dit werkt, is dat de arrayspecificatie vereist dat wanneer je een item leest van een index >= de lengte van de array, het ongedefinieerd teruggeeft. Als je naar zo’n locatie schrijft, wordt de lengte daadwerkelijk bijgewerkt.

Voor mij komt deze constructie het meest overeen met de Java 5-syntaxis waar ik van hou:

for (String item : someArray) {
}

… met het extra voordeel dat u ook weet wat de huidige index in de lus is

Antwoord 19

Esoterische veranderlijke manier

let a= ["Hello", "World"];
while(a.length) { console.log( a.shift() ); }

for (var i in array) if (array.hasOwnProperty(i)) {
    // Do something with array[i]
}

var arr = [1, 2, 3, 1023, 1024];
for (var value; value = arr.pop();) {
    value + 1
}

<script src="//code.jquery.com/jquery-2.1.0.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/underscore.js/1.6.0/underscore-min.js"></script>
<script>
    Benchmark.prototype.setup = function() {
        // Fake function with minimal action on the value
        var tmp = 0;
        var process = function(value) {
            tmp = value; // Hold a reference to the variable (prevent engine optimisation?)
        };
        // Declare the test Array
        var arr = [];
        for (var i = 0; i < 100000; i++)
            arr[i] = i;
    };
</script>

<a href="http://jsperf.com/native-loop-performance/16" 
   title="http://jsperf.com/native-loop-performance/16"
><img src="http://i.imgur.com/YTrO68E.png" title="Hosted by imgur.com" /></a>

var myStringArray = ["hello", "World"];
for(var i in myStringArray) {
  alert(myStringArray[i]);
}

/** Declare inputs */
const items = ['Hello', 'World']
/** Solution 1. Simple for */
console.log('solution 1. simple for')
for (let i = 0; i < items.length; i++) {
  console.log(items[i])
}
console.log()
console.log()
/** Solution 2. Simple while */
console.log('solution 2. simple while')
let i = 0
while (i < items.length) {
  console.log(items[i++])
}
console.log()
console.log()
/** Solution 3. forEach*/
console.log('solution 3. forEach')
items.forEach(item => {
  console.log(item)
})
console.log()
console.log()
/** Solution 4. for-of*/
console.log('solution 4. for-of')
for (const item of items) {
  console.log(item)
}
console.log()
console.log()

 $.each([ 52, 97 ], function( index, value ) {
      alert( index + ": " + value );
 });

var numbers = [1,11,22,33,44,55,66,77,88,99,111];
var sum = 0;
numbers.forEach(function(n){
  sum += n;
});

var sum = 0;
var numbers = [1,11,22,33,44,55,66,77,88,99,111];
for(var i = 0; i<numbers.length; ++i){
  sum += numbers[i];
}
alert(i);

var i, max, myStringArray = ["Hello", "World"];
for (i = 0, max = myStringArray.length; i < max; i++) {
    alert(myStringArray[i]);
    // Do something
}

var i,myStringArray = ["item1","item2"];
for (i =  myStringArray.length; i--) {
    alert(myStringArray[i]);
}

var myStringArray = ["item1","item2"],i = myStringArray.length;
while(i--) {
   // Do something with fruits[i]
}

   var myStringArray = ['Hello', 'World']; // The array uses [] not {}
    for (var i in myStringArray) {
        console.log(i + ' -> ' + myStringArray[i]); // i is the index/key, not the item
    }

var arr = ["apple", "banana", "cherry", "mango"];
arr.forEach(function(item, index, _) {
   console.log("[" + index + "] = '" + item + "'");
});

// 1: for
for (let i = 0; i < arr.length; ++i) {
  console.log(arr[i]);
}
// 2: forEach
arr.forEach((v, i) => console.log(v));
// 3: for in
for (let i in arr) {
  console.log(arr[i]);
}
// 4: for of
for (const v of arr) {
  console.log(v);
}

var x = [4, 5, 6];
for (i = 0, j = x[i]; i < x.length; j = x[++i]) {
    console.log(i,j);
}