迭代集合

操作集合几乎总是意味着迭代：遍历一次一个元素，并为每个元素做一些事情。在本课中我们查看基本语法；在功能数组模块中（地图/ 过滤/减少）我们将学习以更具声明性的方式编写它们。

`for…of` 对于数组

这是您几乎总是想要用来迭代数组的循环：它在每一步提取值。

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

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

如果您还需要索引，请使用 entries()：

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

`for…in` 对于对象 - 谨慎

for…in 迭代对象的键（字符串）：

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

`Object.keys` / `values` / `entries`

这些是迭代对象的可靠方法。他们返回数组，所以它们与 for…of 结合得很好：

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}`);
}

经典 `for`

“老派”for 仍然存在。你很少会用到它，但它很有用当您需要对索引进行精细控制时（跳过元素、迭代向后）：

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]);
}

尝试一下

锻炼#js.m3.l4.e1

尝试：0加载中...

给定“numbers = [3, 5, 7]”，通过使用 for...of 迭代来计算所有元素的总和 (15)。最后一个表达式的计算结果必须为总和。

正在加载编辑器...

显示提示

for (const n 个数字) { sum = sum + n; }

3 次尝试后可用的解决方案

复习练习

锻炼#js.m3.l4.e2

尝试：0加载中...

给定 `prices = { mela: 0.4, pera: 0.55, Banana: 0.3 }`，使用 Object.keys 返回对象 (3) 中的条目总数。