透视for...of...：揭秘其背后的奥秘

for...of...的局限性

for...of...是一种ES6中引入的新循环结构，可以轻松地遍历数组、字符串等可迭代对象。但它有一个限制：无法直接修改元素值。例如，以下代码片段尝试修改数组中的元素值，但实际上并不会改变数组的内容：

const array = [1, 2, 3];

for (const element of array) {
  element += 1;
}

console.log(array); // 输出：[1, 2, 3]

这是因为for...of...循环使用的是引用传递，这意味着它操作的是元素的引用，而不是元素本身。当您尝试修改element的值时，实际上修改的是引用所指向的内存地址中的值，而不是数组中的元素值。

对象属性的特殊性

然而，如果循环中的元素是对象，情况就有所不同。这是因为对象的属性是存储在堆内存中的，而对象的引用本身存储在栈内存中。当您修改对象的属性值时，您实际上修改的是堆内存中的值，而不是栈内存中的引用。

以下代码片段演示了如何使用for...of...循环修改对象属性值：

const person = {
  name: 'John Doe',
  age: 30
};

for (const property in person) {
  person[property] += 1;
}

console.log(person); // 输出：{ name: 'John Doe', age: 31 }

Map的特殊遍历行为

当您使用for...of...循环遍历Map对象时，循环的每次迭代会返回一个包含两个元素的数组，分别是键（key）和值（value）。这是因为Map对象内部使用哈希表来存储键值对，而哈希表是一种将键映射到值的数据结构。

以下代码片段演示了如何使用for...of...循环遍历Map对象：

const map = new Map([
  ['name', 'John Doe'],
  ['age', 30]
]);

for (const [key, value] of map) {
  console.log(`${key}: ${value}`);
}

// 输出：
// name: John Doe
// age: 30

总结

在这篇文章中，我们深入探讨了for...of...循环的局限性，并分析了对象和Map在for...of...循环中的特殊行为。我们了解到，for...of...循环使用的是引用传递，因此无法直接修改元素值。但是，如果循环中的元素是对象，我们可以通过修改对象的属性值来达到修改元素值的目的。此外，Map对象在for...of...循环中的特殊遍历行为也得到了阐述。通过这些知识，我们可以更好地理解JavaScript的迭代机制，并编写出更加健壮的代码。