如何通过变量从函数发送到嵌套函数

Question

作为javascript noob我有一些麻烦理解如何在提供的示例中从一个函数变量到另一个函数。

我想使用设置在xx.projects.resize,xx.projects.item.next中的winHeight（您会在那里看到console.log（winHeight））。

我应该在这里看什么？使用它this.winWidth和this.winHeight

var xx = { 

    init: function() 
    { 
     xx.listener.init() 
    }, 


    listener: { 

     init: function() 
     { 
      xx.listener.resize() 
     }, 

     resize: function() 
     { 
      xx.projects.resize() 
      $(window).on('resize',function(){ 
       xx.projects.resize() 
      }) 
     }, 
    }, 

    projects: { 

     resize: function() 
     { 
      var $display = $('section .item.curr'); 
      var $displayNotActive = $('section.curr .item.next, section.curr .item.prev'); 

      var winWidth = $(window).width(); 
      var winHeight = $(window).height(); 

      var containerWidth, containerHeight; 

      if(winWidth > 1450) { 
       if(winHeight > 1050) { 
        containerWidth = 1200; 
        containerHeight = 900; 
       } else { 
        containerWidth = winWidth - 250; 
        var helperHeight = Math.floor(containerWidth * 3/4); 
        if(helperHeight > (winHeight - 150)) { 
         containerHeight = winHeight - 150; 
         containerWidth = Math.floor(containerHeight * 4/3); 
        } else { 
         containerHeight = helperHeight; 
        } 
       } 
      } else if(winWidth < 600) { 
       containerWidth = 300; 
       containerHeight = 225; 
      } else { 
       containerWidth = winWidth - 250; 
       var helperHeight = Math.floor(containerWidth * 3/4); 
       if(helperHeight > (winHeight - 150)) { 
        containerHeight = winHeight - 150; 
        containerWidth = Math.floor(containerHeight * 4/3); 
       } else { 
        containerHeight = helperHeight; 
       } 
      } 
     }, 


     item: { 
      next: function() 
      { 
       var s = $('#projects section.curr') 
        a = s.find('.item.curr'), 
        n = a.next('.item'), 
        l = a.position() 

       console.log(winHeight); 

       if(n.length > 0){ 
        a.animate({ left: '-100%' }, ep.projects.config.item.speed, ep.projects.config.item.easing) 
        n.animate({ left: l.left }, ep.projects.config.item.speed, ep.projects.config.item.easing, function(){ 
         a.removeClass('curr').addClass('prev') 
         n.removeClass('next').addClass('curr')      
        }) 
       }    
      }, 
     }, 
    } 
} 

$(document).on('ready', xx.init) // Document loaded, DOM ready 

Answer 1

声明在对象范围和访问winHeight和winWidth。

var xx = { 

    projects: { 
     resize: function() { 
      //we are saving winWidth, winHeight in the projects object scope so that it can be accessed from other functions in the same scope 
      this.winWidth = $(window).width(); 
      this.winHeight = $(window).height(); 

      var containerWidth, containerHeight; 

      if (this.winWidth > 1450) { 
       if (this.winHeight > 1050) { 
        containerWidth = 1200; 
        containerHeight = 900; 
       } else { 
        containerWidth = this.winWidth - 250; 
        var helperHeight = Math.floor(containerWidth * 3/4); 
        if (helperHeight > (this.winHeight - 150)) { 
         containerHeight = this.winHeight - 150; 
         containerWidth = Math.floor(containerHeight * 4/3); 
        } else { 
         containerHeight = helperHeight; 
        } 
       } 
      } else if (winWidth < 600) { 
       containerWidth = 300; 
       containerHeight = 225; 
      } else { 
       containerWidth = this.winWidth - 250; 
       var helperHeight = Math.floor(containerWidth * 3/4); 
       if (helperHeight > (this.winHeight - 150)) { 
        containerHeight = this.winHeight - 150; 
        containerWidth = Math.floor(containerHeight * 4/3); 
       } else { 
        containerHeight = helperHeight; 
       } 
      } 
     }, 


     item: { 
      next: function() { 
       var s = $('#projects section.curr') 
       a = s.find('.item.curr'), 
        n = a.next('.item'), 
        l = a.position() 

        console.log(this.winHeight); 

       if (n.length > 0) { 
        a.animate({ 
         left: '-100%' 
        }, ep.projects.config.item.speed, ep.projects.config.item.easing) 
        n.animate({ 
         left: l.left 
        }, ep.projects.config.item.speed, ep.projects.config.item.easing, function() { 
         a.removeClass('curr').addClass('prev') 
         n.removeClass('next').addClass('curr') 
        }) 
       } 
      }, 
     }, 
    } 
} 

---

http://jsfiddle.net/FDeKe/