滚动事件监听器：空 While 循环，它是如何工作的以及为什么？

这个问题是参考这个帖子 https://stackoverflow.com/questions/52025615/vanilla-js-change-active-state-of-links-when-scrolling-refactoring.

总之，要求是让导航中的链接根据当前滚动位置更改状态，我能够使此处提供的代码正常工作，但我不明白为什么要这样做的一行是

while(--index && window.scrollY + 50 < sections[index].offsetTop) {}

我本来会对原始答案发表评论，但显然，我的声誉还不够。

这是整个 JavaScript 代码

const links = document.querySelectorAll('.links');
const sections = document.querySelectorAll('section');

function changeLinkState() {
  let index = sections.length;

  while(--index && window.scrollY + 50 < sections[index].offsetTop) {}
  
  links.forEach((link) => link.classList.remove('active'));
  links[index].classList.add('active');
}

changeLinkState();
window.addEventListener('scroll', changeLinkState);

为什么需要 while 循环，既然它是空的，它不会做任何事情吗？ 我尝试删除 while 循环，但最终破坏了代码。

while(--index && window.scrollY + 50 < sections[index].offsetTop) {}

这会随着每次迭代而减少索引。循环停止时window.scrollY + 50 < sections[index].offsetTop为 false，索引保留为上次“通过”检查的值。

以后更新的时候会用到links[index].classList.add('active');

也可以这样写：

while (index >= 0 && window.scrollY + 50 < sections[index].offsetTop) {
    index--
}

需要检查索引是否有足够的值（也称为不是 -1 或更低），否则当它达到 -1 时会出错，如下所示sections[-1].something不存在。