for...of是ES6专为遍历可迭代对象设计的语法，直接获取元素值，支持break/continue/return，避免for...in问题；需索引时可用entries()，适合值优先场景。
for...of 是 ES6 引入的语法，专为遍历可迭代对象（如数组、字符串、Map、Set 等）设计，比传统 for 循环更简洁，比 forEach 更灵活（支持 break、continue、return），且避免了 for...in 的键类型和原型污染问题。
直接获取元素值，无需下标索引
for...of 默认遍历的是元素本身，不是索引。适合只关心值、不依赖位置的场景：
const arr = ['a', 'b', 'c'];
for (const item of arr) {
console.log(item); // 'a' → 'b' → 'c'
}
如果需要同时访问值和索引，可用 Array.entries()：
Wjs Uploading Video
下载
将一个或多个视频上传至YouTube。当用户想“上传到YouTube”“发YouTube”“批量上传”“upload to YouTube”“post videos to YouTube”或发布到YouTube时使用此技能。
for (const [index, value] of arr.entries()) {
console.log(index, value); // 0 'a' → 1 'b' → 2 'c'
}
配合 break/continue 实现条件中断或跳过
这是 for...of 相比 forEach 的关键优势——能用原生流程控制语句：
- 遇到第一个偶数就停止：
if (num % 2 === 0) break; - 跳过负数继续处理：
if (num - 在函数中 return 可提前退出整个函数，而 forEach 的 return 仅跳出当前回调
遍历类数组或自定义可迭代对象
只要对象有 [Symbol.iterator] 方法，就能用 for...of。例如：
- DOM 节点列表：
for (const el of document.querySelectorAll('div')) { ... } - 字符串按字符遍历：
for (const char of 'hello') { ... } - 手动实现可迭代：在对象上定义
[Symbol.iterator]() { return this[Symbol.iterator](); }
注意性能与兼容性边界
for...of 在现代引擎中已高度优化，性能接近传统 for 循环；但需注意：
- 不支持 IE，需 Babel 或构建工具转译（如 target: 'es5'）
- 不要用于普通对象（无 Symbol.iterator）——会报错，应改用 for...in 或 Object.keys()
- 避免在循环体内修改正在遍历的数组长度（如 push/splice），行为可能不符合预期
