JavaScript 中 for...of 循环的正确用法与平方运算详解-js教程-PHP中文网

JavaScript 中 for...of 循环的正确用法与平方运算详解

本文详细解析 for...of 循环如何遍历数组并安全计算每个元素的平方，澄清 num *= num 与 num * num 的本质区别，说明为何直接修改循环变量虽可行但不推荐，并提供规范、可读性强的实践写法。

本文详细解析 for...of 循环如何遍历数组并安全计算每个元素的平方，澄清 `num *= num` 与 `num * num` 的本质区别，说明为何直接修改循环变量虽可行但不推荐，并提供规范、可读性强的实践写法。

在 JavaScript 中，for...of 循环专用于遍历可迭代对象（如数组、字符串、Map 等），其核心设计原则是：每次迭代中，循环变量（如 num）接收当前元素的一个副本值，而非对原数组项的引用。这意味着对 num 的赋值操作（如 num *= num）仅影响该次循环中的局部变量，不会改变原数组，也不会引发 NaN ——除非 num 本身非数字（而本例中 numbers 全为整数，完全安全）。

那么，为什么学生尝试的这段代码：

for (let num of numbers) {
  num *= num;     // 等价于 num = num * num
  console.log(num);
}

实际上能正常运行并输出 1 4 9 16...？答案是：它完全正确，且逻辑无误。num *= num 在此处等同于 num = num * num，由于 num 是当前数字（如第一次为 1），执行后 num 变为 1，再 console.log(num) 输出 1；第二次 num 是 2，变为 4，依此类推。因此，该写法不会产生 NaN——此前误解可能源于混淆了 num *= 2（翻倍）与 num *= num（自乘），或误以为 *= 操作符在非数字上下文中被调用。

然而，尽管技术上可行，*推荐写法仍是 `console.log(num num)`**，原因有三：

Java JDK 25

Java JDK 25 来自 OpenJDK 官方归档，版本为 JDK 25，本条下载地址已指向官方 Windows x64 zip 安装包直链，适合调试旧项目或兼容旧版 Java 运行环境。

下载

语义清晰：num * num 明确表达“计算平方并输出”，不引入副作用；而 num *= num 隐含“修改变量值”的意图，易造成阅读困惑；
不可变优先原则：函数式编程与现代 JS 最佳实践中，应避免不必要地修改局部变量，尤其当目的仅为获取计算结果时；
兼容性与可扩展性：若后续需同时使用原值与平方值（如 console.log(${num} → ${num * num})），修改后的 num 将丢失原始数据。

此外，ES2016 起还可使用指数运算符 ** 提升可读性：

for (const num of numbers) {
  console.log(num ** 2); // 更直观地表达“num 的平方”
}

注意此处改用 const 声明——既然不重新赋值 num，用 const 更能体现意图，也防止意外修改。

最后，题目要求输出格式为 1 4 9 16 25 36 49 64 81;（末尾带分号且空格分隔）。若需严格匹配，可先收集结果再拼接：

const numbers = [1, 2, 3, 4, 5, 6, 7, 8, 9];
const squares = [];
for (const num of numbers) {
  squares.push(num ** 2);
}
console.log(squares.join(' ') + ';'); // 输出：1 4 9 16 25 36 49 64 81;

总结：num * num 写在 console.log() 中是简洁、安全、符合直觉的标准做法；num *= num 虽语法合法且在此场景下有效，但属于冗余赋值，应避免。掌握 for...of 的“只读遍历”特性，善用 const 与纯表达式，才能写出更健壮、可维护的代码。