Question

Can you explain me why this object does not understand ‘this’?

var circle = {
                radius : 20,
                x : 100 - this.radius / 2,
                y : 100 - this.radius / 2,
             }

console.log(circle.x) // returns NaN, why?

Answer 1

1. because that’s not how this works in JS. this will only be a reference to your object when you somehow cause your object to be assigned as the this value of a function’s calling context.

2. you can’t reference an object literal from itself while it is being created, because it doesn’t yet exist.

If you’re creating circles, you might consider using a constructor:

 function Circle(radius) {
    this.radius = radius,
    this.x = 100 - this.radius / 2,
    this.y = 100 - this.radius / 2,
 }

 var circle_20 = new Circle( 20 );

Because you’re invoking Circle as a constructor using new, this inside the constructor invocation will be a reference to the object being created. That object is implicitly returned since you’re not explicitly returning some other object.