使用for-of循环结合pop()清空JavaScript数组失效问题咨询

你遇到的问题是因为for-of循环依赖数组的迭代器，迭代器会在遍历过程中参考数组的当前长度与元素位置。当你在循环里调用pop()时，数组长度不断缩短，迭代器的遍历进度和数组变化不同步：

原数组共6个元素，遍历过程如下：

• 第一次循环：取索引0的元素"HTML"，执行pop()后数组长度变为5
• 第二次循环：取索引1的元素"CSS"，执行pop()后数组长度变为4
• 第三次循环：取索引2的元素"Javascript"，执行pop()后数组长度变为3
  此时迭代器认为已遍历到数组“末尾”（当前数组长度为3，迭代器已处理到索引2），循环直接终止，所以剩下前3个元素。

方案1：遍历数组副本（适配你的遍历+pop()需求） #

如果一定要用for-of结合pop()的组合，遍历数组的副本即可避免原数组变化影响遍历进度：

let skills = ["HTML", "CSS", "Javascript", "SASS", "Bootstrap", "Tailwind"];
// 用扩展运算符创建数组副本
for (let skill of [...skills]) {
  skills.pop();
}
console.log(skills); // []

方案2：更高效的直接清空方法 #

没必要用遍历删除这种冗余方式，直接用以下两种简单方法即可快速清空数组：

• 设置数组length为0：

skills.length = 0;

• 直接赋值为空数组：

skills = [];

这两种方法效率远高于遍历删除，是日常开发中清空数组的常用方式。

内容的提问来源于stack exchange，提问作者Saad