Pentru-fiecare pe o matrice în JavaScript?

Cum pot buclă prin toate intrările într-o matrice folosind JavaScript?

Am crezut că a fost ceva de genul:

forEach(instance in theArray)

Unde theArray` este matricea mea, dar acest lucru pare a fi incorecte.

Comentarii la întrebare (8)
Soluția

TL;DR

  • Don't folosi de-in dacă nu-l utilizați cu garanții sau sunt măcar conștienți de ce s-ar putea să te muște.
  • Cele mai bune pariuri sunt, de obicei,
  • un pentru-a` bucla (ES2015+ numai),
  • Matrice#forEach ([spec][1] | [MDN][2]) (sau rudele sale "unele" și astfel) (ES5+ numai),
  • o simplă modă veche "pentru", buclă,
  • sau de-in cu garanții. Dar nu's *o mulțime *** mai mult pentru a explora, citiți mai departe...

    JavaScript are puternice semantica pentru looping prin tablouri și matrice ca obiecte. Am'am împărțit răspunsul în două părți: Opțiuni pentru veritabilă matrice, și opțiuni pentru lucruri care sunt doar array-ca, cum ar fi "argumente" de obiect, alte iterable obiecte (ES2015+), DOM colecții, și așa mai departe. Am'll rapid rețineți că puteți utiliza ES2015 opțiuni acum, chiar pe ES5 motoare, de transpiling ES2015 să ES5. Căutare pentru "ES2015 transpiling" / "ES6 transpiling" pentru mai multe... Bine, las's se uite la opțiunile noastre:

    Pentru Matrice Reale

    Ai trei opțiuni în [ECMAScript 5][3] ("ES5"), versiunea cea mai larg acceptată în momentul de față, și două mai adăugat în [ECMAScript 2015][4] ("ES2015", "ES6"):

  1. Utilizarea "forEach" și conexe (ES5+)
  2. Folosiți un simplu "pentru" bucla
  3. Utilizarea de-in corect
  4. Utilizarea de-a (foloseste un iterator implicit) (ES2015+)
  5. Utilizați un iterator în mod explicit (ES2015+) Detalii:

    1. Utilizarea "forEach" și conexe

    În orice vag-mediu modern (deci, nu IE8) în cazul în care aveți acces la "Matrice" caracteristici adăugate de către ES5 (direct sau folosind polyfills), puteți folosi "forEach" ([spec][1] | [MDN][2]):

var a = ["a", "b", "c"];
a.forEach(function(entry) {
    console.log(entry);
});

"forEach" acceptă o funcție de apel invers și, opțional, o valoare a folosi ca "asta", atunci când apel ca apel invers (nu sunt folosite de mai sus). Callback este apelată pentru fiecare intrare în serie, în ordine, sărind peste inexistente intrări în tablouri rare. Deși am folosit doar un singur argument de mai sus, callback este apelată cu trei: valoarea de fiecare intrare, indicele de intrare, și o referire la matricea're iterarea peste (în cazul în care funcția nu't au deja la îndemână). Dacă nu're sprijinirea învechite browsere, cum ar fi IE8 (care NetApps prezinta la peste 4% cota de piață ca din acest scris, în septembrie 2016), puteți folosi fericit "forEach" în general-scop, o pagină web fără un shim. Dacă aveți nevoie pentru a sprijini învechite browsere, shimming/polyfilling "forEach" este foarte usor de facut (de căutare pentru "es5 shim" pentru mai multe opțiuni). "forEach" are avantajul că nu't trebuie să declare indexare și valoarea variabile în conținut de aplicare, cum se're furnizate ca argumente la funcția de repetare, și atât de frumos luneta doar ca repetare. Daca're îngrijorat de execuție costul de a face un apel de funcție pentru fiecare vector de intrare, don't fi; detalii. În plus, "forEach" este "bucla prin-le pe toate" funcție, dar ES5 definite mai multe alte utile "locul de muncă-ți de drum prin matrice și de a face lucruri" funcții, inclusiv:

  • [fiecare][5] (se oprește looping prima dată callback returneaza "false" sau ceva falsey)
  • [ceva][6] (se oprește looping prima dată apel invers returnează "adevărat" sau ceva sinceră)
  • [filtru][7] (creează o nouă matrice, inclusiv elemente în cazul în care filtrul funcția returnează "adevărat" și omițând cele în care se întoarce "false")
  • [harta][8] (creează o nouă matrice de valori returnate de apel invers)
  • [reduce][9] (se acumulează o valoare de care apelează în mod repetat apel invers, trecerea de la valorile anterioare; vezi spec pentru detalii; util pentru însumarea cuprins de o matrice și multe alte lucruri)
  • [reduceRight][10] (cum ar fi "reduce", dar funcționează în ordine descrescătoare, mai degrabă decât ordine crescătoare)

    2. Folosiți un simplu "pentru" bucla

    Uneori metodele vechi sunt cele mai bune:

var index;
var a = ["a", "b", "c"];
for (index = 0; index < a.length; ++index) {
    console.log(a[index]);
}

Dacă lungimea de matrice a câștigat't schimba în buclă, și-l's de performanță sensibile cod (puțin probabil), un pic mai complicat versiune hapsân lungimea în față ar putea fi o mica mai repede:

var index, len;
var a = ["a", "b", "c"];
for (index = 0, len = a.length; index < len; ++index) {
    console.log(a[index]);
}

Și/sau numărare înapoi:

var index;
var a = ["a", "b", "c"];
for (index = a.length - 1; index >= 0; --index) {
    console.log(a[index]);
}

Dar cu moderne JavaScript motoare, l's rare aveți nevoie să prelungim ultimul pic de suc. În ES2015 și mai mare, puteți face index și valoare variabile locale la "pentru" bucla:

let a = ["a", "b", "c"];
for (let index = 0; index < a.length; ++index) {
    let value = a[index];
    console.log(index, value);
}
//console.log(index);   // would cause "ReferenceError: index is not defined"
//console.log(value);   // would cause "ReferenceError: value is not defined"
let a = ["a", "b", "c"];
for (let index = 0; index < a.length; ++index) {
    let value = a[index];
    console.log(index, value);
}
try {
    console.log(index);
} catch (e) {
    console.error(e);   // "ReferenceError: index is not defined"
}
try {
    console.log(value);
} catch (e) {
    console.error(e);   // "ReferenceError: value is not defined"
}

Și când faci asta, nu doar "valoare", dar, de asemenea, "index" este recreat pentru fiecare buclă iterație, în sensul de închidere a creat în corpul buclei să păstreze o referință la "index" (și "valoare") creat pentru o anumită iterație:

let divs = document.querySelectorAll("div");
for (let index = 0; index < divs.length; ++index) {
    divs[index].addEventListener('click', e => {
        console.log("Index is: " + index);
    });
}
let divs = document.querySelectorAll("div");
for (let index = 0; index < divs.length; ++index) {
    divs[index].addEventListener('click', e => {
        console.log("Index is: " + index);
    });
}
<div>zero</div>
<div>one</div>
<div>two</div>
<div>three</div>
<div>four</div>

Dacă ai avut cinci divs, ai'd a obține "Indicele este: 0" dacă ați făcut clic pe primul și "Indicele este: 4" dacă ați făcut clic pe ultimul. Acest lucru nu funcționa dacă utilizați var în loc delasa`.

3. Utilizarea de-in corect

Te'll a obține oameni spunându-vă să utilizați de-in, dar [că's nu ce de-in pentru][11]. de-in bucle prin nenumărate proprietăți a unui obiect, nu indici de o matrice. Ordinea nu este garantat, nu chiar în ES2015 (ES6). ES2015+ definește un ordin de proprietăți obiect (prin [[OwnPropertyKeys]], [[Enumerate]] și lucrurile pe care le utilizați, cum ar fi [de Obiect.getOwnPropertyKeys][12]), dar nu nu definirea că de-in vor urma ordinea asta. (Detalii în [acest alt răspuns][13].) Singurele cazuri de utilizare pentru de-in pe o matrice sunt:

  • It's o [rare tablouri][14] cu masiv lacune în ea, sau
  • Ai're folosind non-element de proprietăți și doriți să le includeți în buclă Doar că primul exemplu: puteți folosi de-in pentru a vizita acele sparese elementele de matrice dacă utilizați garanții corespunzătoare:

// `a` is a sparse array
var key;
var a = [];
a[0] = "a";
a[10] = "b";
a[10000] = "c";
for (key in a) {
    if (a.hasOwnProperty(key)  &&        // These checks are
        /^0$|^[1-9]\d*$/.test(key) &&    // explained
        key 
Comentarii (24)

Notă: Acest răspuns este iremediabil out-of-data. Pentru o abordare mai modernă, uita-te la metodele disponibile pe o serie. Metodele de interes ar putea fi:

  • forEach
  • harta
  • filtru
  • zip
  • reduce
  • fiecare
  • unele

Modul standard de a repeta o matrice în JavaScript este o vanilie "pentru" -bucla:

var length = arr.length,
    element = null;
for (var i = 0; i < length; i++) {
  element = arr[i];
  // Do something with element
}

Rețineți, totuși, că această abordare este bună doar dacă ai o matrice densa, și fiecare indice este ocupat de un element. Dacă o matrice este rară, atunci puteți rula în probleme de performanță cu această abordare, deoarece va repeta peste o mulțime de indici care nu într-adevăr există în matrice. În acest caz, pentru .. în buclă ar putea fi o idee mai bună. Cu toate acestea**, trebuie să utilizați garanții adecvate pentru a se asigura că numai proprietățile dorite de matrice (care este, elementele de matrice) au acționat, încă din anii pentru..în buclă va fi, de asemenea, enumerate în moștenirea browsere, sau daca proprietăți suplimentare sunt definite caenumerable`.

În ECMAScript 5 nu va fi un forEach metoda pe matrice de prototip, dar acesta nu este acceptat în moștenirea browsere. Deci, pentru a fi capabil să-l folosească în mod constant trebuie să fie un mediu care acceptă (de exemplu, Node.js pentru server side JavaScript), sau de a folosi un "Polyfill". La Polyfill pentru această funcționalitate este, cu toate acestea, banal și de a face codul mai ușor de citit, este un bun polyfill pentru a include.

Comentarii (4)

Dacă utilizați jQuery, bibliotecă, puteți utiliza jQuery.fiecare:

$.each(yourArray, function(index, value) {
  // do your stuff here
});

EDIT :

După fiecare întrebare, utilizatorul vrea cod în javascript în loc de jquery atât de editare este

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

Buclă înapoi

Cred că invers pentru bucla merită o mențiune aici:

for (var i = array.length; i--; ) {
     // process array[i]
}

Avantaje:

  • Nu aveți nevoie pentru a declara o temporară " len " variabila, sau a compara împotriva matrice.lungime pe fiecare iterație, ori de care ar putea fi un minut de optimizare.
  • Eliminarea frați de la DOM în ordine inversă este de obicei mai eficientă. (Browser-ul trebuie să facă mai puțin schimbarea de elementele sale interne tablouri.)
  • Dacă tu modifica matrice în timp ce looping, la sau după index i (de exemplu, elimina sau introduce un element în matrice[i]`), apoi o buclă înainte ar sări element care a schimbat stânga în poziția i, sau re-proces i - lea element care a fost mutat la dreapta. Într-un tradițional pentru buclă, ai putea update am pentru a indica următorul element care are nevoie de prelucrare - 1, dar pur și simplu se inversează sensul de repetare este de multe ori o simplu și soluție mai elegantă.
  • În mod similar, atunci când modificarea sau eliminarea imbricate elemente DOM, de prelucrare în sens invers poate eluda erori. De exemplu, ia în considerare modificarea innerHTML de un nod părinte înainte de manipularea copiilor săi. În momentul în care copilul nod este atins, va fi detașat de la DOM, au fost înlocuite de un nou create copil atunci când părintele's innerHTML a fost scris.
  • Este scurt de tip, și citiți, decât unele dintre celelalte opțiuni disponibile. Deși se pierde la forEach() și să ES6's pentru ... de.

    Dezavantaje:

  • Procesează elementele în ordine inversă. Dacă ai construi o nouă serie de rezultate, sau lucruri de imprimare pe ecran, în mod natural producția va fi inversat cu privire la ordinea inițială.
  • În mod repetat introducerea frați în DOM ca primul copil în scopul de a păstra ordinea lor este mai puțin eficientă. (Browser-ul va ține avea să schimbe lucrurile.) Pentru a crea noduri DOM eficient și în ordine, doar bucla înainte și adăugați normal (și folosi, de asemenea, un "fragment de document").
  • În buclă inversă este confuz pentru dezvoltatorii de juniori. (Vei considera asta un avantaj, în funcție de outlook.)

    În cazul în care am folosi întotdeauna?

    Unii dezvoltatori utilizarea inversă pentru buclă implicit, dacă nu există un motiv bun pentru a bucla înainte. Deși câștiguri de performanță sunt de obicei nesemnificative, este un fel de țipete:

    "Doar a face acest lucru pentru fiecare element din lista, nu't grijă despre ordinea!" Cu toate acestea, în practică, că este nu de fapt o indicație de încredere de intenție, deoarece este imposibil de distins de acele ocazii, atunci când nu grijă despre scopul, și chiar nu trebuie la bucla in sens invers. Deci, în fapt, un alt construct ar fi necesare pentru a exprima exact "nu't de îngrijire a" intenție, ceva disponibilă în prezent în cele mai multe limbi, inclusiv ECMAScript, dar care ar putea fi numit, de exemplu, forEachUnordered(). Dacă scopul nu't contează, și eficiență este un motiv de îngrijorare (în cele mai intime buclă de un joc sau motor de animație), atunci acesta poate fi acceptabilă utilizarea inversă pentru bucla de du-te-pentru model. Doar amintiți-vă că văd un revers pentru bucla din codul existent nu înseamnă neapărat că ordinea irelevant!

    Era mai bine să utilizați forEach()

    În general, de nivel superior codul de unde claritate și siguranță sunt mai mari preocupări, mi-a fost recomandat anterior, folosind Array::forEach ca implicit model pentru looping (deși în aceste zile eu prefer să folosesc pentru..de`). Motive pentru a prefera "forEach" peste o buclă inversă sunt:

  • Este clar pentru a citi.
  • Se indică faptul că nu nu este de gând să fie mutat în bloc (care este întotdeauna o surpriză posibil ascunzându-se în lung pentru și în timp ce bucle).
  • Acesta vă oferă o gratuit de aplicare pentru închidere.
  • Reduce pierderile de variabile locale și accidentală, coliziunea cu (și mutație a) exterioare variabile. Atunci când vezi inversă pentru buclă în cod, care este un indiciu că este inversat pentru un motiv bun (probabil, unul dintre motivele descrise mai sus). Și văzând-o transmite tradiționale pentru bucla poate indica faptul că schimbarea poate avea loc. (Dacă discuția de intenție nu are nici un sens pentru tine, atunci tu și codul tău poate beneficia de vizionarea Crockford's prelegere pe [Stil de Programare & Creierul Tău](https://www.youtube.com/watch?v=taaEzHI9xyY&t=480).)

    Acum este chiar mai bine să utilizați pentru..a!

    Există o dezbatere cu privire la posibilitatea pentru..a " sau " forEach() sunt de preferat:

  • Pentru un maxim de sprijin browser-ul, pentru..de` necesită un polyfill pentru iteratori, ceea ce face aplicația ușor mai lent pentru a executa și puțin mai mare pentru a descărca.
  • Pentru care motiv (și să încurajeze utilizarea de "harta" și "filtru"), unele front-end ghiduri de stil interdicția pentru..de` complet!
  • Dar preocupările de mai sus nu este aplicabilă Node.js aplicații, în cazul în care pentru..de` acum este bine susținută.
  • Și în plus așteaptă nu funcționează în interiorul forEach(). Folosind pentru..aeste [cel mai clar model](https://github.com/airbnb/javascript/issues/1122#issuecomment-259876436) în acest caz. Personal, am tendința de a folosi orice pare mai simplu de a citi, dacă nu de performanță sau de minimizare a devenit o preocupare majoră. Deci, în aceste zile eu prefer să folosesc pentru..a "în loc de" forEach(), dar nu va folosi întotdeauna "hartă" sau "filtru" sau ["găsi"] (https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/find) sau ceva atunci când este cazul. (De dragul de colegii mei, eu folosesc rar reduce.)

    Cum funcționează?

for (var i = 0; i < array.length; i++) { ... }   // Forwards

for (var i = array.length; i--; )    { ... }   // Reverse

Veți observa că i - este mijlocul clauze (în cazul în care vom vedea, de obicei, o comparație) și ultima propoziție este gol (în cazul în care vom vedea, de obicei, i++). Asta înseamnă că i - este, de asemenea, utilizat ca stare pentru continuare. În mod esențial, este executată și verificată înainte fiecare iterație.

  • Cum poate începe de la matrice.lungime fără explodează? Pentru că i - ruleaza înainte fiecare iterație, în prima iterație ne va fi de fapt accesarea element în matrice.lungime - 1` care evită orice probleme cu <grevă>Matrice-out-of-limite "nedefinit" elemente.
  • De ce nu't opri iterarea înainte de index 0? Bucla se va opri iterarea când starea i - se evaluează la un falsey valoare (atunci când se produce 0). Trucul este că, spre deosebire de --eu oscilant i - operator diminuări de "i", dar dă valoare înainte de de decrementare. Consola poate demonstra acest lucru: > var i = 5; [i, eu..., am]; [5, 5, 4] Deci, în ultima iterație, i a fost anterior 1 și i - expresie modificări la 0 dar, de fapt, randamentele 1 (sinceră), și deci condiția trece. Pe următoarea iterație i - modificările i a -1 dar randamentele 0 (falsey), provocând execuție să renunțe imediat din partea de jos a buclei. În tradiționale înainte de buclă, i++ " și " ++i sunt interschimbabile (ca Douglas Crockford puncte). Cu toate acestea, în marșarier pentru buclă, pentru că decrementare este, de asemenea, starea noastră de exprimare, trebuie să rămânem cu i - dacă vrem să proceseze element la indicele 0.

    Trivia

    Unii oameni le place pentru a trage o sageata mica in reverse "pentru", buclă, și se încheie cu un cadou:

for (var i = array.length; i --> 0 ;) {

Du-te la credite WYL mi-a arătat beneficiile și ororile inversă de curent.

Comentarii (3)

Unele C-stil limbi folosesc "foreach" pentru a bucla prin enumerări. În JavaScript se face cu `pentru..în structura de buclă:

var index,
    value;
for (index in obj) {
    value = obj[index];
}

Există o captură. pentru..în` va bucla prin fiecare obiect's enumerable membrii și membrii de pe prototipul său. Pentru a evita citirea valorilor care sunt moștenite prin obiect's prototipul, pur și simplu a verifica în cazul în care proprietatea aparține obiect:

for (i in obj) {
    if (obj.hasOwnProperty(i)) {
        //do stuff
    }
}

În plus, ECMAScript 5 a adăugat o "forEach" metoda de a `Matrice.prototip care poate fi folosit pentru a enumera peste o matrice folosind un calback (cu polyfill este în docs astfel încât să puteți utiliza în continuare pentru browsere mai vechi):

arr.forEach(function (val, index, theArray) {
    //do stuff
});

L's important să rețineți că, Matrice.prototip.forEach nu't rupe atunci când callback returneaza "false". jQuery și Underscore.js furnizeze propriile lor variante pe fiecare pentru a oferi bucle care pot fi scurt-circuitat.

Comentarii (2)

Dacă doriți să buclă pe o matrice, utilizare standard de trei-parte "pentru" bucla.

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

Puteți obține unele optimizări de performanță de cache `myArray.lungimea sau iterarea peste invers.

Comentarii (5)

Stiu ca e un post vechi, și există atât de multe răspunsuri mari deja. Pentru un pic mai mult de exhaustivitate m-am gândit'd arunca în altul folosind AngularJS. Desigur, aceasta se aplică numai dacă're folosind Unghiulare, evident, cu toate acestea, am'd ca a pus-o oricum.

unghiulară.forEach are 2 argumente și, opțional, un al treilea argument. Primul argument este obiectul (matrice) pentru a itera peste, cel de-al doilea argument este funcție de iterator, și opțional al treilea argument este contextul object (de fapt menționată în interiorul buclei, ca 'asta'.

Există diferite moduri de a folosi forEach buclă unghiulare. Cea mai simplă și, probabil, cel mai utilizat este

var temp = [1, 2, 3];
angular.forEach(temp, function(item) {
    //item will be each element in the array
    //do something
});

Un alt mod care este util pentru copierea de articole de la un tablou la altul este

var temp = [1, 2, 3];
var temp2 = [];
angular.forEach(temp, function(item) {
    this.push(item); //"this" refers to the array passed into the optional third parameter so, in this case, temp2.
}, temp2);

Totuși, nu't trebuie să faci asta, pur și simplu, puteți face următoarele și-l's echivalente pentru exemplul anterior:

angular.forEach(temp, function(item) {
    temp2.push(item);
});

Acum există argumente pro și contra de a folosi unghiulară.forEach funcție de cum s-a construit în cu aromă de vanilie "pentru" bucla.

Pro

  • Ușor de lizibilitate
  • Ușor writability
  • Dacă sunt disponibile, `unghiulară.forEach va folosi ES5 buclă forEach. Acum, voi ajunge la randamentul în contra secțiune, ca buclele forEach sunt mult mai lent decât pentru bucle. Menționez acest lucru ca un pro, deoarece's frumos să fie coerente și standardizate.

Luați în considerare următoarele 2 bucle imbricate, care face exact același lucru. Las's spun ca am 2 tablouri de obiecte și fiecare obiect conține o serie de rezultate, fiecare dintre care are o Valoare de proprietate, care's un șir de caractere (sau orice altceva). Și să's a spus am nevoie pentru a repeta peste fiecare dintre rezultatele și dacă au're egale, atunci pentru a efectua o acțiune:

angular.forEach(obj1.results, function(result1) {
    angular.forEach(obj2.results, function(result2) {
        if (result1.Value === result2.Value) {
            //do something
        }
    });
});

//exact same with a for loop
for (var i = 0; i < obj1.results.length; i++) {
    for (var j = 0; j < obj2.results.length; j++) {
        if (obj1.results[i].Value === obj2.results[j].Value) {
            //do something
        }
    }
}

Acordate acesta este un foarte simplu exemplu ipotetic, dar am'am scris triple încorporat pentru bucle folosind cea de a doua abordare și era foarte greu de citit, și de a scrie pentru care contează.

Contra

  • Eficiența. unghiulară.forEach, și nativ "forEach", pentru care contează, sunt atât de mult mai lent decât în mod normal "pentru" bucla....despre 90% mai lent. Deci pentru seturi mari de date, mai bine să rămânem la nativ "pentru" bucla.
  • Nici o pauză, continuă, sau de a reveni sprijin. "continuă" este de fapt susținută de "accident", pentru a continua într-un unghiulară.forEach ai pune simplu un retur; declarația în funcție de ca unghiulară.forEach(matrice, funcția(postul) { dacă (someConditionIsTrue) return; }); care va face ca acesta să continue din funcție pentru că iterație. Acest lucru este, de asemenea, datorită faptului că nativ "forEach" nu are suport break sau continue.

Am'm sigur că nu's diverse alte argumente pro și contra, precum și, și vă rugăm să nu ezitați să adăugați orice ca tu de cuviință. Simt că, în concluzie, dacă aveți nevoie de eficiență, rămânem doar cu nativ "pentru" bucla pentru looping are nevoie. Dar, în cazul seturilor de date sunt mai mici și o eficiență este bine să dea în schimb pentru lizibilitate și writability, apoi prin toate mijloacele arunca un unghiulare.forEach în care băiatul rău.

Comentarii (0)

O forEach punerea în aplicare (a[a se vedea în jsFiddle][1]):

function forEach(list,callback) {
  var length = list.length;
  for (var n = 0; n < length; n++) {
    callback.call(list[n]);
  }
}

var myArray = ['hello','world'];

forEach(
  myArray,
  function(){
    alert(this); // do something
  }
);
Comentarii (3)

Dacă tu nu't mintea golirea matrice:

var x;

while(x = y.pop()){ 

    alert(x); //do something 

}

"x" va conține ultima valoare de " y " și va fi eliminat din matrice. Puteți folosi, de asemenea, shift() care va oferi și elimina primul element de "y".

Comentarii (2)

O soluție simplă ar fi să utilizați underscore.js biblioteca. L's furnizarea de mai multe instrumente utile, cum ar fi fiecare si automat va delega locuri de muncă în native "forEach", dacă este disponibil.

O CodePen exemplu a modului în care funcționează este:

var arr = ["elemA", "elemB", "elemC"];
_.each(arr, function(elem, index, ar)
{
...
});

Se vedea, de asemenea,

Comentarii (0)

Există trei implementări de "foreach" în jQuery, după cum urmează.

var a = [3,2];

$(a).each(function(){console.log(this.valueOf())}); //Method 1
$.each(a, function(){console.log(this.valueOf())}); //Method 2
$.each($(a), function(){console.log(this.valueOf())}); //Method 3
Comentarii (1)

Ca Valoare de 6:

list = [0, 1, 2, 3]
for (let obj of list) {
    console.log(obj)
}

În cazul în care " de "evită ciudățenii asociat cu" în "și face să funcționeze ca "pentru" bucla de orice altă limbă, și se leaga eu în buclă spre deosebire de cadrul funcției.

Acolade ({}) poate fi omis atunci când există doar o singură comandă (de exemplu, în exemplul de mai sus).

Comentarii (0)

Probabil pentru(i = 0; i < matrice.length; i++)` bucla nu este cea mai buna alegere. De ce? Dacă aveți acest lucru:

var array = new Array();
array[1] = "Hello";
array[7] = "World";
array[11] = "!";

Metoda va suna din matrice[0] " cu " matrice[2]`. În primul rând, acest lucru va prima referință variabile nu't chiar trebuie, a doua nu ar avea variabile în matrice, și a treia, acest lucru va face codul mai îndrăznețe. Uite aici, l's de ce am folosit:

for(var i in array){
    var el = array[i];
    //If you want 'i' to be INT just put parseInt(i)
    //Do something with el
}

Și dacă vrei să fie o funcție, puteți face acest lucru:

function foreach(array, call){
    for(var i in array){
        call(array[i]);
    }
}

Dacă doriți să rupă, un pic mai logica:

function foreach(array, call){
    for(var i in array){
        if(call(array[i]) == false){
            break;
        }
    }
}

Exemplu:

foreach(array, function(el){
    if(el != "!"){
        console.log(el);
    } else {
        console.log(el+"!!");
    }
});

Se întoarce:

//Hello
//World
//!!!
Comentarii (0)

Nu e't orice `pentru fiecare buclă în nativ JavaScript. Puteți folosi fie biblioteci pentru a obține această funcționalitate (eu recomand Underscore.js), utilizați un simplu "pentru", în buclă.

for (var instance in objects) {
   ...
}

Cu toate acestea, rețineți că pot exista motive pentru a utiliza chiar și un simplu "pentru" bucla (vezi Stack Overflow întrebare Ce este cu "for...in" cu matrice repetare o idee rea?)

var instance;
for (var i=0; i < objects.length; i++) {
    var instance = objects[i];
    ...
}
Comentarii (0)

Acesta este un iterator pentru NON-rare listă în cazul în care indexul incepe de la 0, care este scenariul tipic atunci când se ocupă cu document.getElementsByTagName sau document.querySelectorAll)

function each( fn, data ) {

    if(typeof fn == 'string')
        eval('fn = function(data, i){' + fn + '}');

    for(var i=0, L=this.length; i < L; i++) 
        fn.call( this[i], data, i );   

    return this;
}

Array.prototype.each = each;  

Exemple de utilizare:

Exemplu #1

var arr = [];
[1, 2, 3].each( function(a){ a.push( this * this}, arr);
arr = [1, 4, 9]

Exemplu #2

each.call(document.getElementsByTagName('p'), "this.className = data;",'blue');

Fiecare etichetă p se class="albastru"

Exemplu #3

each.call(document.getElementsByTagName('p'), 
    "if( i % 2 == 0) this.className = data;",
    'red'
);

Fiecare etichetă p se class="roșu">

Exemplu #4

each.call(document.querySelectorAll('p.blue'), 
    function(newClass, i) {
        if( i < 20 )
            this.className = newClass;
    }, 'green'
);

Și, în sfârșit, primele 20 de albastru p categorie sunt schimbat la verde

Prudență atunci când se utilizează șir de funcții: funcția este creat out-of-context și ar trebui să fie utilizate numai în cazul în care sunteți sigur de definire variabilă. În caz contrar, mai bine să treacă funcții în cazul în care de definire a domeniului evaluării este mult mai intuitiv.

Comentarii (0)

Sunt câteva modalități la bucla printr-o matrice în JavaScript, ca mai jos:

pentru - l's cel mai comun. Plin bloc de cod pentru looping

var languages = ["Java", "JavaScript", "C#", "Python"];
var i, len, text;
for (i = 0, len = languages.length, text = ""; i < len; i++) {
    text += languages[i] + "<br>";
}
document.getElementById("example").innerHTML = text;
<p id="example"></p>

în timp ce - buclă în timp ce este o condiție prin. Se pare a fi cel mai rapid buclă

var text = "";
var i = 0;
while (i < 10) {
    text +=  i + ") something<br>";
    i++;
}
document.getElementById("example").innerHTML = text;
<p id="example"></p>

nu/în timp ce -, de asemenea, bucla printr-un bloc de cod, în timp ce condiția este adevărată, va rula cel puțin o dată

var text = ""
var i = 0;

do {
    text += i + ") something <br>";
    i++;
}
while (i < 10);

document.getElementById("example").innerHTML = text;
<p id="example"></p>

Funcțional bucle - "forEach", "harta", "filtru", de asemenea, "reduce" (acestea bucla prin funcție, dar acestea sunt utilizate în cazul în care aveți nevoie pentru a face ceva cu matrice, etc.

// For example, in this case we loop through the number and double them up using the map function
var numbers = [65, 44, 12, 4];
document.getElementById("example").innerHTML = numbers.map(function(num){return num * 2});
<p id="example"></p>

Pentru mai multe informații și exemple despre programare funcțională pe tablouri, uita-te la blog Funcțional programare în JavaScript: harta, se filtrează și reduce.

Comentarii (1)

ECMAScript 5 (versiunea de pe JavaScript) pentru a lucra cu Tablouri:

forEach - Reiterează prin fiecare element din matrice și de a face tot ce ai nevoie cu fiecare element.

['C', 'D', 'E'].forEach(function(element, index) {
  console.log(element + " is #" + (index+1) + " in the musical scale");
});

// Output
// C is the #1 in musical scale
// D is the #2 in musical scale
// E is the #3 in musical scale

În cazul în care, mai interesat pe funcționare pe matrice folosind unele caracteristică încorporat.

harta * Se creează o nouă matrice cu rezultatul din funcția de apel invers. Această metodă este bun pentru a fi utilizate atunci când aveți nevoie pentru a formata elementele de matrice.

// Let's upper case the items in the array
['bob', 'joe', 'jen'].map(function(elem) {
  return elem.toUpperCase();
});

// Output: ['BOB', 'JOE', 'JEN']

reducerea - după Cum spune și numele, se reduce matrice la o singură valoare de asteptare având funcția de a trece la elementul curent și rezultatul anterior de execuție.

[1,2,3,4].reduce(function(previous, current) {
  return previous + current;
});
// Output: 10
// 1st iteration: previous=1, current=2 => result=3
// 2nd iteration: previous=3, current=3 => result=6
// 3rd iteration: previous=6, current=4 => result=10

*fiecare *** - Întoarce true sau false dacă toate elementele din matrice trece testul în funcție de apel invers.

// Check if everybody has 18 years old of more.
var ages = [30, 43, 18, 5];
ages.every(function(elem) {
  return elem >= 18;
});

// Output: false

filtru - Foarte similară cu excepția faptului că fiecare filtru returnează o matrice cu elemente care returnează adevărat anumită funcție.

// Finding the even numbers
[1,2,3,4,5,6].filter(function(elem){
  return (elem % 2 == 0)
});

// Output: [2,4,6]
Comentarii (0)

Nu's nici incorporat capacitatea de a rupe în "forEach". Pentru a întrerupe executarea folosi Matrice#unele ca mai jos:

[1,2,3].some(function(number) {
    return number === 1;
});

Acest lucru funcționează pentru că "unele" întoarce cât mai curând orice de callback, executată în array comanda, returnează true, scurt-circuit executarea de restul. Original Raspuns vezi Matrice prototip pentru unele

Comentarii (0)

De asemenea, am dori să adăugați acest lucru ca pe o compoziție de o buclă inversă și un răspuns de mai sus pentru cineva care ar dori această sintaxă prea.

var foo = [object,object,object];
for (var i = foo.length, item; item = foo[--i];) {
    console.log(item);
}

Pro:

Beneficiul pentru acest lucru: Aveți de referință deja în primul ca't nevoie pentru a fi declarat mai târziu cu o altă linie. Acesta este la îndemână atunci când looping prin obiectul array.

Contra:

Acest lucru va rupe de referință ori de câte ori este fals - falsey (nedefinit, etc.). Acesta poate fi folosit ca un avantaj totusi. Cu toate acestea, s-ar face un pic mai greu de citit. Și, de asemenea, în funcție de browser-ul poate fi "nu" optimizat pentru a lucra mai repede decât unul original.

Comentarii (0)

jQuery folosind `$.harta:

var data = [1, 2, 3, 4, 5, 6, 7];

var newData = $.map(data, function(element) {
    if (element % 2 == 0) {
        return element;
    }
});

// newData = [2, 4, 6];
Comentarii (1)