Salt la conținutul principal
Modulul 3 · Lecția 4 din 412/32 în curs~10 min
Lecții din modul (4/4)

Iterarea peste colecții

Manipularea colecțiilor înseamnă aproape întotdeauna iterarea: a trece prin elementele pe rând și făcând câte ceva pentru fiecare. În această lecție noi uitați-vă la sintaxele de bază; în modulul matrice funcționale (hartă / filtrare/reducere) vom învăța să le scriem mai declarativ.

for…of pentru matrice

Este bucla pe care veți dori să o utilizați aproape întotdeauna pentru a repeta o matrice: it extrage valoarea la fiecare pas.

JS
const colori = ['rosso', 'verde', 'blu'];

for (const c of colori) {
  console.log(c);
}
// 'rosso'
// 'verde'
// 'blu'

Dacă aveți nevoie și de index, utilizați entries():

JS
for (const [i, c] of colori.entries()) {
  console.log(`${i}: ${c}`);
}
// '0: rosso', '1: verde', '2: blu'

for…in pentru obiecte — cu prudență

for…in repetă cheile (șiruri) unui obiect:

JS
const utente = { nome: 'Anna', eta: 28 };
for (const k in utente) {
  console.log(`${k} = ${utente[k]}`);
}

Object.keys / values / entries

Acestea sunt modalitatea robustă de a repeta un obiect. Ei returnează matrice și așa se combină foarte bine cu for…of:

JS
const utente = { nome: 'Anna', eta: 28 };

Object.keys(utente); // ['nome', 'eta']
Object.values(utente); // ['Anna', 28]
Object.entries(utente); // [['nome', 'Anna'], ['eta', 28]]

for (const [k, v] of Object.entries(utente)) {
  console.log(`${k} → ${v}`);
}

Clasic for

„Scoala veche” for încă există. Îl vei folosi rar, dar este util atunci când aveți nevoie de un control fin asupra indexului (sărirea elementelor, iterare invers):

JS
for (let i = 0; i < colori.length; i++) {
  console.log(i, colori[i]);
}

// Backwards
for (let i = colori.length - 1; i >= 0; i--) {
  console.log(colori[i]);
}

Încearcă

Exercițiu#js.m3.l4.e1
Încercări: 0Se încarcă…

Având în vedere `numere = [3, 5, 7]`, calculați suma tuturor elementelor (15) prin iterarea cu for...of. Ultima expresie trebuie evaluată la sumă.

Se încarcă editorul...
Afișează indiciu

pentru (const n numere) { sum = suma + n; }

Soluție disponibilă după 3 încercări

Exercițiu de revizuire

Exercițiu#js.m3.l4.e2
Încercări: 0Se încarcă…

Având în vedere `prices = { mela: 0.4, pera: 0.55, banana: 0.3 }`, returnați NUMĂRUL TOTAL de intrări din obiect (3) folosind Object.keys.

Se încarcă editorul...
Afișează indiciu

Object.keys(obj) returnează o matrice; .lungimea spune câte chei există.

Soluție disponibilă după 3 încercări