Javascript 如何缩短此语句

如何缩短这段代码以及我可以在这里使用哪种数组方法。我想在每次单击单个元素时添加类，其余元素删除类

 const activeLink = document.querySelectorAll(".nav-item");
 activeLink[0].addEventListener("click", () => {
  activeLink[0].classList.add("active");

  activeLink[1].classList.remove("active");
  activeLink[2].classList.remove("active");
  activeLink[3].classList.remove("active");
});

activeLink[1].addEventListener("click", () => {
  activeLink[1].classList.add("active");

  activeLink[0].classList.remove("active");
  activeLink[2].classList.remove("active");
  activeLink[3].classList.remove("active");
});

activeLink[2].addEventListener("click", () => {
  activeLink[2].classList.add("active");

  activeLink[0].classList.remove("active");
  activeLink[1].classList.remove("active");
  activeLink[3].classList.remove("active");
});

activeLink[3].addEventListener("click", () => {
  activeLink[3].classList.add("active");

  activeLink[0].classList.remove("active");
  activeLink[1].classList.remove("active");
  activeLink[2].classList.remove("active");
});

---

您可以跟踪当前活动的项目并重置此项目，而不是每次单击都循环浏览所有项目

---

感谢您的回复，并给我一个有效的好片段。非常感谢，我还尝试了另一种方法（让i=0；i{activeLink[i].classList.add（“活动”）；console.log（activeLink[i]）；for（让j=0；jlet activeLink = null; document.querySelectorAll(".nav-item").forEach(navItem => { navItem.addEventListener("click", () => { if (activeLink) { activeLink.classList.remove("active"); } navItem.classList.add("active"); activeLink = navItem; }); });