2012-07-07 11 views
5
class Game 

    foo: null 

    play: -> 

    @foo = 2 
    @animate() 

    animate: -> 

    requestAnimationFrame(@animate, 1000) 
    console.log('foo = ', @foo) 


$ -> 
    game = null 

    init = -> 

    game = new Game() 
    game.play() 

    init() 

खेल में चेतन विधि में लॉग पैदा करता है:उदाहरण चर अपरिभाषित हो जाता है - CoffeeScript

foo = 2

foo = अपरिभाषित

तो foo पहली कॉल चेतन करने के बारे में 2 है और फिर उसके बाद अपरिभाषित। क्या कोई यह बता सकता है कि मैं इसे कैसे और कैसे ठीक कर सकता हूं। किसी भी प्रकार की मदद की बेहद सराहना की जाती है।

+0

'requestAnimationFrame' दूसरे तर्क के रूप में कोई संख्या नहीं लेता है; इसके बजाए, यह दिए गए फ़ंक्शन ASAP को कॉल करता है (आमतौर पर 'सेटटाइमआउट (func, 0) 'से अधिक तेज़) बशर्ते ब्राउज़र टैब अग्रभूमि में हो। Https://developer.mozilla.org/en/DOM/window.requestAnimationFrame –

उत्तर

11

जब आप setInterval पर कॉल करते हैं, तो संदर्भ खो जाता है और दूसरी बार @window है। आप वसा-तीर तरीकों उचित this बनाए रखने की आवश्यकता:

animate: => 
+0

देखें अपने उत्तर के लिए धन्यवाद। इसने काम किया है लेकिन अनुरोध के साथ बहुत अजीब व्यवहार किया है एनीमेशन फ्रेम। मैं अनुरोध कॉल कर रहा हूंएनीमेशन फ्रेम जैसा किया जाना चाहिए लेकिन वसा तीर के साथ यह अनुरोध करने के लिए अन्य कॉल पर कॉल दोहराना है। –

+0

@ user881920 यह पुनरावृत्ति सही व्यवहार है। आपको हारून के जवाब को स्वीकार करना चाहिए। अगर आपको 'requestAnimationFrame' के साथ कोई समस्या हो रही है, तो आपको इसके बारे में एक अलग प्रश्न पूछना चाहिए। –

+0

इस उत्तर के लिए धन्यवाद। सरल और स्पष्ट। – Glenn

5

आप इस प्रकार animate परिभाषित कर सकते हैं:

animate: -> 
    callback = (=> @animate()) 
    requestAnimationFrame(callback, 1000) 
    console.log('foo = ', @foo) 

तकनीक यहाँ एक बाध्य विधि प्राप्त करने के लिए है। @animate अपने आप से अनबाउंड है, लेकिन (=> @animate()) इसका बाध्य संस्करण है।

आप UnderscoreJS उपयोग कर रहे हैं इस प्रकार एक समान परिणाम प्राप्त कर सकते हैं:

animate: -> 
    callback = _.bind(@animate, @) 
    requestAnimationFrame(callback, 1000) 
    console.log('foo = ', @foo) 

और आप जावास्क्रिप्ट के बाद के संस्करण का उपयोग कर रहे हैं, तो आप ऐसा करने में सक्षम इस प्रकार हो सकता है:

animate: -> 
    callback = @animate.bind(@) 
    requestAnimationFrame(callback, 1000) 
    console.log('foo = ', @foo)