함수에서 중첩 함수로 변수를 보낼 수있는 방법

Question

javascript noob로서 함수에서 변수를 다른 함수로 가져올 수있는 방법을 이해하는 데 어려움이 있습니다.

xx.projects.resize에 설정된 winHeight을 xx.projects.item.next에 사용하고 싶습니다. 거기에 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/