用于in循环和pop()的Javascript

Question

我刚刚学习了循环的数组，循环遍历数组的每个元素，我用它来清空数组，使用pop()删除数组的最后一个元素，但这不起作用。

let skills = ["HTML", "CSS", "Javascript", "SASS", "Bootstrap", "Tailwind"];
for (let skill of skills) {
skills.pop();
}
console.log(skills); // HTML , CSS, Javascript

Answer 1

数组迭代器就像一个实时集合；如果数组在迭代时发生了更改，则迭代器返回的下一个项将反映该更改。正如您在上面的链接中看到的，它的工作方式是从0开始递增索引，直到达到数组的长度。

for (let skill of skills) {

在这种情况下，几乎相当于

for (let i = 0; i < skills.length; i++) {
const skill = skills[i]

数组迭代器不会返回最初调用迭代器时确定的静态项目数量；要返回的下一个项目是在每次迭代中动态确定的。因此，如果您在迭代中从数组中.pop一个项，那么总的迭代次数将比没有弹出的情况少一次，除非您已经处于数组的末尾。

如果数组中有6个项目(如这里所示)，那么您将弹出3次，迭代次数将比项目数量少3次，从而总共产生3次迭代，并删除3个项目。

如果在迭代时将数组变成不变的数组，那么.pop就会起作用。(这不是一个建议-有更好的方法来清空数组-只是为了说明，让发生的事情更清楚。)

let skills = ["HTML", "CSS", "Javascript", "SASS", "Bootstrap", "Tailwind"];
for (let skill of [...skills]) {
skills.pop();
}
console.log(skills); // empty

这是因为[...skills]创建了一个单独的数组，当调用skills.pop时，该数组的元素不会被删除。