Using a JavaScript Function as a Class

  • Java
  • Thread starter Jamin2112
  • Start date
  • #1
986
8

Main Question or Discussion Point

I figured out what the bug in my code is, but now I need to figure out how to best remedy it.

Here's my function:

Code:
        function snake(C, C_h, C_w)
        {
                /* NOTE TO SELF: C is a Raphel object. Can't find a method to return the height
                   and width of a Raphael object in the documentation: 
                   [PLAIN]http://raphaeljs.com/reference.html#Raphael.[/PLAIN] [Broken]
                   Using C_h and C_w for now, but should probably change it later.
                */
            
                this.linkSize = 10; // size of a snake unit, in pixels
                
                /* On instantiation, the snake direction is down and has 1 link */
                this.dy = this.linkSize;
                this.dx = 0;
                this.link = C.rect(C_h/2, C_w/2, this.linkSize, this.linkSize);
                this.link.attr("fill", "#d7a900");
                this.body = [this.link];
                
                /* Event listener for changing the direction of the
                   snake with arroy keys on the keyboard
                */
                this.redirect = function(dirnum)
                {
                    switch (dirnum)
                    {
                        /*
                            dirnum corresponds to
                            1 ---> right
                            2 ---> down
                            3 ---> left
                            4 ---> up
                        */
                        case 1: 
                            this.dx = this.linkSize;
                            this.dy = 0;
                            break;
                        
                        case 2:
                            this.dx = 0;
                            this.dy = this.linkSize;
                            break;
                        
                        case 3:
                            this.dx = -this.linkSize;
                            this.dy = 0;
                            break;
                        
                        case 4:
                            this.dx = -this.linkSize;
                            this.dy = 0;
                            break;
                        
                        default: // never happens
                            break;
                    }
                            
                }
[COLOR="Red"][B]                this.move = function()
                {
                    /*
                        ..........
                    */
                    
                    var temp = this.body[0];
                    this.body[0].translate(this.dx, this.dy);
                    for (var i = 1, j = this.body.length; i < j; ++i)
                    {
                        this.body[i] = temp;
                        temp = this.body[i];
                    }
                }[/B][/COLOR]
                this.mover = setInterval(this.move, 500);                

        }
The problem is in the bolded block. I want to refer to the outer function's member body, but I realize it's instead referring to move's nonexistent member body. What is the best way to remedy this?
 
Last edited by a moderator:

Answers and Replies

  • #2
DavidSnider
Gold Member
485
128
Newer browsers have Function.prototype.bind

setInterval( this.move.bind(this), 500 );
 
  • #3
986
8
Newer browsers have Function.prototype.bind

setInterval( this.move.bind(this), 500 );
That's useful. Out of curiosity, how would I have done it without this feature?
 
  • #4
DavidSnider
Gold Member
485
128
That's useful. Out of curiosity, how would I have done it without this feature?
The implementation looks something like this
Code:
Function.prototype.bind = function (scope) {
    var fn = this;
    return function () {
        return fn.apply(scope);
    };
}
This would have worked too

Code:
    var that = this;
    setInterval(function() {
        that.move();
    }, 500);
 
Last edited:

Related Threads for: Using a JavaScript Function as a Class

Replies
5
Views
832
  • Last Post
Replies
1
Views
1K
Replies
3
Views
16K
Replies
13
Views
4K
Replies
11
Views
1K
  • Last Post
Replies
1
Views
1K
Top