Uncaught TypeError: this.doSomething is not a function...... this.clickText.on('pointerdown', () => this.doSomething())

Phaser 3
1

Why can’t the function be seen?

<!doctype html> 
<html lang="en"> 
<head> 
    <script src="//cdn.jsdelivr.net/npm/phaser@3.11.0/dist/phaser.js"></script>
</head>
<body>

<script type="text/javascript">

    var config = {
        type: Phaser.AUTO,
        width: 800,
        height: 600,
        scene: {
            preload: preload,
            create: create,
            update: update
        }
    };

    var game = new Phaser.Game(config);
    
    function preload ()
    {
    }

    function create ()
    {
        this.clickText = this.add.text(100,100, 'Click me')
        this.clickText.setInteractive( {useHandCursor: true})
        this.clickText.on('pointerdown', () => this.doSomething())
                
    }

    function doSomething()
    {
        console.log('did something!')
    }

    function update ()
    {
    }

</script>

</body>
</html>
2

Ok, it’s because of “this”.
this.doSomething() was wrong

OLD:
this.clickText.on(‘pointerdown’, () => this.doSomething())

NEW:
this.clickText.on(‘pointerdown’, () => doSomething(this))

I passed “this” as a param so doSomething can access the variables that create() can

3

Another way is

this.clickText.on('pointerdown', () => { doSomething.call(this) })

It sets the calling context without altering the arguments.

4

I’m not sure I follow the point of your alternative.
You’re just sticking a this. in front of the method call, and still passing in (this) as an arg. ?

5

It lets you call a function as if it were a scene method (when it isn’t).