Array.from en action

Array.from

let headings = Array.from(document.querySelectorAll('article h1'), function(el) {
  return {
    "pos": el.getBoundingClientRect().top,
    "text": el.textContent
  }
});

Event : scroll

window.addEventListener("scroll", function() {
  if (window.pageYOffset <= headings[0].pos) {
    document.querySelector(".current-section").classList.remove("show");
  } else {

    document.querySelector(".current-section").classList.add("show");

// Décomposition

    for (let {
        pos,
        text
      } of headings) {
      if (window.pageYOffset >= pos) {
        document.querySelector(".current-section .name").textContent = text;
      } else {
        break;
      }
    }
  }
}, false);