从 jquery 翻译为 vanilla ： $('.hack4-cms-anchor-section').each((i,sec) =>observer.observe(sec) );

Question

我已将代码从 jquery 翻译为 vanilla。

一切看起来都不错，但我在最后一行出现错误“Array.prototype.forEach 回调必须是一个函数”。没能修复它。

普通的 jquery 行是什么：

// start intersection observer for each anchor section
   $('.hack4-cms-anchor-section').each((i,sec) => observer.observe(sec) );
   });

这是完整的代码（有问题的行是最后一行）：

document.addEventListener("DOMContentLoaded", () => {
    const linkTextArr = []; 
    // for each filter button
    var navlinkbtn = document.querySelectorAll('.navlink_button');
    Array.prototype.forEach.call(navlinkbtn, function(link, index){
       // get its text content and reformat to a valid ID
       let linkText = link.textContent.replace(/\W/g,'_').toLowerCase(); 
       // set the reformatted linkText as the link href attribute
       link.setAttribute('href', '#'+linkText);
       // push reformatted linkText to array 
       linkTextArr.push(linkText);
       });
    // for each section
    var hack4cmsanchorsection = document.querySelectorAll('.hack4-cms-anchor-section');
    Array.prototype.forEach.call(hack4cmsanchorsection, function(index, link){
        // set id attribute to linkTextArray value sequentially
        // 1st sectn gets id: linkTextArr[0] etc..
        var section = document.getElementsByTagName('section');
        section.id = linkTextArr + [index]; 
        });
        // set up intrsctn obsrvr 
        // (navlnk btn s'allum qd sur sectn)
        // 2 observ whn th anchor sectns ar in viewport
        let observer = new IntersectionObserver((entries, observer) => { 
            // for each anchor section
            entries.forEach(entry => {
                // if it's in the viewport
                if(entry.isIntersecting){
                    // remov active class from current active link
                   document.querySelector('.navlink_button.hack4-active').classList.remove('hack4-active');
                    // add active class to current active link
                    document.querySelector(`.navlink_button[href='#${entry.target.id}']`).classList.add('hack4-active');
                   }
            });
        // set thrshld to 1 ensures the whole anchor section
        // is in viewport befor adding activ class to activ link
        // this part ', {threshold: 1}' is optional
    }, {threshold: 0});
// start intersection observer for each anchor section
hack4cmsanchorsection.forEach.call((i,sec) => observer.observe(sec) );
});