Javascript JS重新加载/返回对象值

我有以下资料：

var Module = (function() {
  
  var init = function() {

    var vars =  {
      topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
      header : $(".header").outerHeight()
    }

    // Recalculate values when window  is resized
    $(window).bind("resize", function() {
      vars;
    });

  });

})();

$(function() {
  Module.init();
});

我试图在调整窗口大小时重新计算这些变量，但它不起作用。注：我有权维护功能结构。我尝试在外部添加变量，但“窗口大小调整”无法将其选中

// Recalculate values when window  is resized
$(window).bind("resize", function() {
  vars;
});

在上面的语句中，

vars实际上什么都不做。您似乎假设它将从原始初始值设定项重新计算其值，但这在javascript（或我熟悉的任何其他语言）中都不会发生

相反，您可以提取函数中的初始化逻辑并重用它

var Module = (function() {

function computeVars() {
    return {
      topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
      header : $(".header").outerHeight()
    };
}

 var vars =  computeVars();

  var init = function() {

    // Recalculate values when window  is resized
    $(window).bind("resize", function() {
      vars = computeVars();
    });

  });

})();

$(function() {
  Module.init();
});

在上面的语句中，
vars实际上什么都不做。您似乎假设它将从原始初始值设定项重新计算其值，但这在javascript（或我熟悉的任何其他语言）中都不会发生

相反，您可以提取函数中的初始化逻辑并重用它

var Module = (function() {

function computeVars() {
    return {
      topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
      header : $(".header").outerHeight()
    };
}

 var vars =  computeVars();

  var init = function() {

    // Recalculate values when window  is resized
    $(window).bind("resize", function() {
      vars = computeVars();
    });

  });

})();

$(function() {
  Module.init();
});

在这里。只调用
vars无法刷新指定的数据。
您必须在内部重新计算它，或者调用函数

var Module = (function() {
  
  var init = function() {

    var vars =  {
      topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
      header : $(".header").outerHeight()
    }

    // Recalculate values when window  is resized
    $(window).bind("resize", function() {
      //vars;
      vars =  {
       topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
       header : $(".header").outerHeight()
     }
    });

  });

})();

$(function() {
  Module.init();
});

或者你最好这样做

var Module = (function() {
  
  var init = function() {

    var vars =  calculate_vars();

    var calculate_vars = ()=>{
        return  {
           topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
           header : $(".header").outerHeight()
        }
    }
    // Recalculate values when window  is resized
    $(window).bind("resize", function() {
      vars = calculate_vars();
    });

  });

})();

$(function() {
  Module.init();
});

在这里。只调用
vars无法刷新指定的数据。
您必须在内部重新计算它，或者调用函数

var Module = (function() {
  
  var init = function() {

    var vars =  {
      topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
      header : $(".header").outerHeight()
    }

    // Recalculate values when window  is resized
    $(window).bind("resize", function() {
      //vars;
      vars =  {
       topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
       header : $(".header").outerHeight()
     }
    });

  });

})();

$(function() {
  Module.init();
});

或者你最好这样做

var Module = (function() {
  
  var init = function() {

    var vars =  calculate_vars();

    var calculate_vars = ()=>{
        return  {
           topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
           header : $(".header").outerHeight()
        }
    }
    // Recalculate values when window  is resized
    $(window).bind("resize", function() {
      vars = calculate_vars();
    });

  });

})();

$(function() {
  Module.init();
});

试试这个

var Module = (function() { 
  init = function() {
    return {
      topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
      header : $(".header").outerHeight()
    }
  };
    $(window).bind("resize", function() {
      init();
    });
    return init;
})();

$(function() {
  Module()
});

试试这个

var Module = (function() { 
  init = function() {
    return {
      topBar : ( $("#topbar").outerHeight() > 0 ) ? $("#topbar").outerHeight() : 0,
      header : $(".header").outerHeight()
    }
  };
    $(window).bind("resize", function() {
      init();
    });
    return init;
})();

$(function() {
  Module()
});