Arguments and methods inside sprites and timedEvents

Phaser 3
1

Hello everyone

I begin with phaser3 and I have a question. I manage to make my code run (which I put below), but only if I make some global variables and functions (such as count and onEvent1() ). I would like to know if someone has an idea how to put them inside the class sceneA.
I made several tries and tests. Apparently the variable this.count define in the class constructor isn’t the same than the one inside the callback of sprite1.on. How can I refer to the class varaiable count inside the callback ?
The same problem occurs for this.scene.start inside the callback of this.button.on,
and for timedEvent1 and the callback onEvent1.
Thank you in advance for any idea

class sceneA extends Phaser.Scene {
  constructor() {
    super({ key: 'sceneA' });
    this.count = 0;
  }

  preload() {
    this.load.image('sprite1', 'assets/sprite1.png');
    this.load.image('button1', 'assets/button1.png');
  }

  create() {
    var sprite1 = this.physics.add.sprite(50, 50, 'sprite1').setInteractive().setScale(1.5);
    sprite1.on('pointerdown', function () {
      sprite.setVelocityY(-200);
      this.count++;
    });

    this.button = this.add.sprite(350, 360, 'demarrer').setInteractive();
    this.button.visible = false;
    this.button.on('pointerdown', function () {
      this.scene.start('sceneB');
    });

    var timedEvent1 = this.time.addEvent({
      delay: 12000,
      callback: this.onEvent1,
      callbackScope: this,
      repeat: 0,
    });
  }

  update() {
    if (this.count >= 8) {
      this.button.visible = true;
    }
  }

  onEvent1() {
    this.texte1 = this.add.text(100, 100, 'Hello !', {
      fontFamily: 'Arial',
      fontSize: '32px',
      fill: '#228B22',
    });
    this.count++;
  }
}
2

There are a few ways, one is to pass context in the third argument to on():

this.button.on(
  'pointerdown',
  function () {
    this.scene.start('sceneB');
  },
  this
);
3

Thanks samme
That’s works fine
I found another way to do it

create(){
var scene = this.scene;
this.button.on('pointerdown', function () {scene.start('sceneB');});

by making alias for this.scene
but for “this.count” it is more tricky because “var count = this.count” is a copy of the value of this.count and is evolving independently.
But by making it with an object it pass it by reference

constructor(){
this.obj = {count:0};
}
create(){
var obj = this.obj;
sprite1.on('pointerdown', function () {  sprite.setVelocityY(-200);
      obj.count++;});

But, Samme, your suggestion is better, I didn’t know we can pass argument of scope after the callback.
Thanks
This post is resolved.

4 
var scene = this;
// etc.

can also work.

5

Right Samme
This possibility was since ECMAScript 3.
It was usually written in prototypal
var self = this;

We can also use arrows functions now
this.button.on('pointerdown', () => {this.scene.start('sceneB');});
should probably work