methods within the objects of the function class in javascript

3

I'm trying to learn an HTML5 framework for videogame development, called phaser, so I'm in the tutorial of here , where it says 'Loading Assets' there is a preload function that loads the images or assets commonly called 'assets' of the game, the code of the function is this:

function preload ()
{
    this.load.image('sky', 'src/games/firstgame/assets/sky.png');
    this.load.image('ground', 'src/games/firstgame/assets/platform.png');
    this.load.image('star', 'src/games/firstgame/assets/star.png');
    this.load.image('bomb', 'src/games/firstgame/assets/bomb.png');
    this.load.spritesheet('dude', 
        'src/games/firstgame/assets/dude.png',
        { frameWidth: 32, frameHeight: 48 }
    );
}

What strikes me about this is that within the lines of the function code is called a parameter or method load , and then image is that the functions within javascript are objects so that the statement this reference to the same object function in this case preload . I tried to find some kind of documentation of this method or parameter load to know if it is some type of object defined in Javascript but I did not find anything, I would like to understand why you can write what is shown in the function since I think that it is not a defined method within the Function class of Javascript

    
asked by MeEncantanLosPerritos 24.02.2018 в 01:47
source

3 answers

1

This preload method is inside an object that extends Phaser.State, which contains the load (Phaser.Loader) object that is what you call to load assets in the game I leave the official documentation.

Phaser.State documentation: link

Documentation Phaser.State.load link

    
answered by 29.03.2018 / 11:55
source
0

The functions in javascript are executed with a context for this determined.

In web scripts this usually corresponds to the window object, but one could do the following:

function miFuncion(){
    this.a = 1;
}

var obj = {};
miFuncion.call(obj);
console.log(obj); // imprime {a: 1}

Effectively specifying the context for this

    
answered by 24.02.2018 в 02:17
-1

When you use Phaser, the way to work is to create an object Game and pass it to it , among other attributes, the State object, which must / can have the preload, create, update, render methods. Something like the following:

function preload() { ... }

function create() { ... }

let game= new Phaser.Game(800, 600, Phaser.CANVAS, 'phaser-example', 
{ preload: preload, create: create });

What Phaser does internally is something like this:

//this es la instancia de Game
var preload=this.state.preload;
preload();

Therefore, this is an instance of Phaser.Game , which has the properties that you are using .

If you declare preload like this:

let preload= () => {


};

You could check how the game fails, because the arrow functions have the context set at declaration time.

    
answered by 03.03.2018 в 21:36