zmiennej instancji zostaje niezdefiniowany - coffeescript

Question

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() 

Dziennik w metodzie ożywionej w Grze produkuje:

foo = 2

foo = niezdefiniowany

Więc foo jest 2 na pierwsze wezwanie do animowania a następnie niezdefiniowane. Czy ktoś mógłby wyjaśnić, dlaczego i jak mogę to naprawić? Każda pomoc jest doceniana.

Answer 1

Po wywołaniu setInterval, kontekst zostaje utracony, a po raz drugi @ jest window. Musisz metody tłuszczu strzałek, aby zachować odpowiednią this:

animate: => 

Answer 2

Można zdefiniować animate następująco:

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

Technika tutaj jest, aby sposób związany. @animate samo w sobie jest niezwiązane, ale (=> @animate()) jest związaną wersją tego.

Można uzyskać podobne rezultaty jeśli używasz underscore.js następująco:

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

A jeśli używasz nowszej wersji języka JavaScript, możesz to zrobić w następujący sposób:

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