Improving Object-Oriented Code

[crhallberg]

The <script> sketch from https://GitHub.com/crhallberg/CollisionDetection/blob/p5js/Website/object_oriented_collision.html is correct.

But somehow, the displayed code in the site doesn't match the actual running code:
https://CrHallberg.com/CollisionDetection/Website/object_oriented_collision.html

B/c this. is missing in many places. For example, inside method Rectangle::display():

    display() {
        if (this.hit) fill(255, 150, 0);
        else fill(0, 150, 255);
        noStroke();
        rect(x, y, w, h);
    }

Clearly rect(x, y, w, h); should be rect(this.x, this.y, this.w, this.h); instead!

cc @GoToLoop

[crhallberg]

Didn't know Issues was disabled. Turned on now!

[GoToLoop]

Here's how I'd rewrite Rectangle::display() in order to use less this., by using "Object Destructuring Assignment": ;-)

https://Developer.Mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment#Object_destructuring

    display() {
        const { x, y, w, h, hit } = this;
        hit? fill(255, 150, 0) : fill(0, 150, 255);
        noStroke().rect(x, y, w, h);
    }

[crhallberg]

I did a bit more research and you are right that it should be rect(this.x, this.y, this.w, this.h);. I wasn't intentionally avoiding this., I am just surprised to learn that it is required.

Looking at the repository, it looks like that code is in place but the markdown is wrong. I've updated it here: 47d7e4c.

[GoToLoop]

... I am just surprised to learn that it is required.

Unlike Java, C#, etc., which are compiled, JS can't easily determine whether an identifier inside a method w/o any prefix is a member of its own class or simply a local variable/parameter. Or it can even be a closure variable!

Transpilable languages like Typescript, CoffeeScript,etc., would be able to do some analysis in order to determine whether an identifier w/o any prefix would be a member of its own class.

However, such feature doesn't exist yet for those transpilers. And I have my doubts if they'd be willing to add it.

[GoToLoop]

Shiffman's This Dot Song: :-P
https://www.YouTube.com/watch?v=M5d7vygUPoQ