Monitoring navigation function: logic judgment
A few comments:


Array.forEach takes a callback, this can be done directly as so:  ems.forEach(watchNav)
Also, you have scope conflicts: the global variable em, and the function parameter em
A third comment: You should n ot edit your question based on feedback in comments.
Your if statement is fine.



&lt;script&gt;
    var ems = document.querySelectorAll(".panel"),
        viewHeight = window.innerHeight,
        clientHeight = document.body.clientHeight,
        timeOut = null;

    ems.forEach(watchNav);

    function watchNav(em) {
        var emHeight = em.offsetHeight;
        var emTop = em.offsetTop;
        clearTimeout(timeOut);

        window.addEventListener("scroll", function (e) {
            var scrollY = window.scrollY;

            timeOut = setTimeout(function () {
                // Logical judgment: how to optimize, want better implementation.
                // Such as reducing the if statement
                // ++++++++++++++++
                if (scrollY &gt; emTop || scrollY + viewHeight / 2 &gt; emTop || scrollY + viewHeight &gt; emTop + emHeight) {
                    console.log("...activing...");
                    em.classList.add("view-focus");
                } else {
                    console.log("none");
                    em.classList.remove("view-focus");
                }

                if (scrollY &gt; emTop + emHeight / 2) {
                    console.log("none");
                    em.classList.remove("view-focus");
                }
                // ++++++++++++++++
            }, 40);
        }, false);
    }
&lt;/script&gt;
```