Question

我正试图找到一种方法来最小化Selector查找次数。我的问题是我有一个使用base $（document）.ready（）定义的变量，需要在嵌套在$（document）.ready（）

内的函数内进行更新。

考虑这个例子（编辑：我更新它更具说明性）

<script>

//var $current_page = $home_page;  **<--I DONT want to do this, going global
                                        and of course it doesn't work since
                                        $home_page isn't defined yet.**

$(document).ready(function() {
  var $home_page = $("#home-page");
  var $portfolio_page = $("#portfolio-page");
  var $about_page = $("#about-page");
  var $current_page = $home_page;  // **<--This variable, in this scope level,
                                   //      is what I want updated**

  $("#home-btn").click(function () {
   $current_page.stop()
   $current_page.show()
   $current_page.animate({
    duration: 360, 
    easing: 'easeInCirc',
    complete: function() {
        $(this).css({ top: -700 });
    }

   ); 

   $current_page = $home_page;
  });

   $("#portfolio-btn").click(function () {
       $current_page.stop()
       $current_page.show()
       $current_page.animate({
         duration: 360, 
         easing: 'easeInCirc',
         complete: function() {
             $(this).css({ top: -700 });
         }

   ); 

   $current_page = $portfolio_page; //<--This needs to somehow update the
                                    //   variable in the $(document).ready
                                    //   scope, but not global**
  });
 });
 <script>

如何更新变量$ current_page 而不使其成为全局变量？

编辑：这样做是为了在单击菜单项时为当前页面div设置动画。是的，这是缺少的东西，是的，它可能没有意义。这只是一个例子，而不是实际的应用程序。

我理解这个例子对于性能来说仍然是微不足道的，只是忽略了这个事实。我只是想知道如何实现这一点，而不是关于它是最佳实践还是性能的教训。谢谢你们。

Answer 1

内部函数创建一个closure，捕获它所定义的范围内的变量。所以你已经拥有了你所要求的......

......这是否是个好主意是另一回事。

对于初学者，您实际上并未修改您列出的代码中的值 - 您为$current_page指定了已初始化的相同值。

但假设您刚刚省略了通常用于为$current_page选择不同值的代码，您需要问自己：这是否真的是必要？您正在基于元素ID执行查找，并在变量中缓存对该元素的引用，而不知道是否或何时实际需要它。充其量，这会导致可能不必要的查找;在最坏的情况下，它可能导致内存泄漏。为什么不直接跟踪ID本身，并在实际需要的时间和地点查找元素？在实际遇到性能问题之前不要担心性能......或者您可能会发现过早优化导致的问题比解决的问题多。

同样适用于$home_page，$portfolio_page和$about_page - 如果您需要对这些内容的引用，您的页面加载（稍微）会更慢以后的元素，当你可以根据需要查看它们时。

Answer 2

“如何更新变量$ current_page而不使其成为全局变量？”

您可以立即更新。内部点击处理函数可以修改$ current_page。
“我正试图找到一种方法来最小化Selector查找次数。”

但实际上，如果您正在使用其他选择器更改$ current_page，那么您实际上可以赚更多。

但是你真正想要做的事情并不是很清楚。

更新jQuery $（document）.ready（）基本范围内的变量？

2 个答案: