Prototypes and OOP

[JamieR]

Hi,

I am new to both JavaScript and Phaser, and am following this tutorial: https://mozdevs.github.io/html5-games-workshop/en/guides/platformer/start-here/

I am confused by the difference between prototypes and objects in Phaser - are they both implementations of OOP or what? I am attempting to create a UML class diagram, but I am struggling to put it together as I don't know if prototypes are objects or not!

Also, if i have something.prototype.move = function (), is that an example of using the prototype's/object's methods? And how does this. work?

Thanks so much!

[samme]

I would check out https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects, as it's complicated, but:

• In JavaScript, everything* is an object. There are no classes in the traditional sense, but there are constructors. "Plain" objects can be created from scratch.
• Every* object has a link (__proto__) to another object and obtains properties from it.
• Any object can act as a "prototype", but in the traditional JS model, this source object is stored on the prototype property of a constructor function. You can think of a constructor–prototype pair (eg, Sprite, Sprite.prototype) as a kind of "class".
• this is a keyword referencing a dynamically bound value. In the most common case, it's the object that invoked the current method.
• You can make your first Phaser game without knowing any of this.  

As an example:

var game = new Phaser.Game(/*…*/);

game.constructor === Phaser.Game;                // -> true
game.__proto__   === Phaser.Game.prototype;      // -> true
game.boot        === Phaser.Game.prototype.boot; // -> true