javascript - 如何更优雅地编写这段代码？

Question

我为 WordPress 网站的不同页面编写了三次相同的代码。我觉得它可以写得更优雅，但不幸的是我还没有达到实现这一目标的技能水平。有什么办法可以将所有这些组合成更简洁的东西吗？它还可能帮助我了解更多有关 JavaScript 可以做什么和不能做什么的信息。

if (jQuery(document.body).hasClass("home")) {

    jQuery(window).scroll(function () {
        var threshold = 654;
    if (jQuery(window).scrollTop() >= 654)
        jQuery('#sidebar').addClass('fixed');
    else
        jQuery('#sidebar').removeClass('fixed');
    });

} else if (jQuery(document.body).hasClass("single") || jQuery(document.body).hasClass("page")) {

    jQuery(window).scroll(function () {
        var threshold = 20;
    if (jQuery(window).scrollTop() >= 20)
        jQuery('#sidebar').addClass('fixed');
    else
        jQuery('#sidebar').removeClass('fixed');
    });

} else {

    jQuery(window).scroll(function () {
        var threshold = 236;
    if (jQuery(window).scrollTop() >= 236)
        jQuery('#sidebar').addClass('fixed');
    else
        jQuery('#sidebar').removeClass('fixed');
    });
}

Answer 1

var threshold = 236;
if (jQuery(document.body).hasClass("home")) {
   threshold = 654;
} else if (jQuery(document.body).hasClass("single") || jQuery(document.body).hasClass("page")) {
   threshold = 20;
}

var scrolled = false;
jQuery(window).scroll(function () {  
    if (!scrolled && jQuery(window).scrollTop() >= threshold){
        jQuery('#sidebar').addClass('fixed');
        scrolled = true;
    } else if (scrolled && jQuery(window).scrollTop() < threshold) { 
        jQuery('#sidebar').removeClass('fixed');
        scrolled = false;
    }
});

更新:我创建了一个简单的演示来展示如何在他的父级中实现侧边栏滚动。
Demo on CodePen