Javascript method doesn't see object variable

Question

var Shape = function(type)
{
    this.type = type;

    addEventListener("resize", this.align);
}

Shape.prototype.align = function()
{
    alert(this.type);
}

.

var variable = new Shape('rectangle');

When I resized, I want alert rectangle but it alerts undefined

alert(this) (or rather log it to the console), what do you see? — Teemu
– Teemu, Commented May 3, 2016 at 10:29
adding to BenG's answer. Under event, this will point to window — Harpreet Singh
– Harpreet Singh, Commented May 3, 2016 at 10:33

BenG · Accepted Answer · 2016-05-03 10:32:24Z

1

you need to pass the scope to use this in the resize event.

var Shape = function(type) {
  this.type = type;
  addEventListener("resize", this.align.bind(this));
}

Shape.prototype.align = function() {
  alert(this.type);
}


var variable = new Shape('rectangle');

answered May 3, 2016 at 10:32

BenG

15.2k5 gold badges48 silver badges62 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Aer0 · Accepted Answer · 2016-05-03 10:29:49Z

0

You need to use variable.align(), since you're creating a new object. By doing so, I get what you're asking for: An alert with 'rectangle'.

answered May 3, 2016 at 10:29

Aer0

3,91720 silver badges35 bronze badges

Comments

Rayon · Accepted Answer · 2016-05-03 10:43:56Z

0

The value of this is determined by how a function is called. It can't be set by assignment during execution, and it may be different each time the function is called. ES5 introduced the bind method to set the value of a function's this regardless of how it's called [MDN]

Function.prototype.bind() method creates a new function that, when called, has its this keyword set to the provided value.

var Shape = function(type) {
  this.type = type;
  addEventListener("resize", function() {
    this.align();
  }.bind(this));
  //OR addEventListener("resize", this.align.bind(this));  
}

Shape.prototype.align = function() {
  alert(this.type);
}


var variable = new Shape('rectangle');

answered May 3, 2016 at 10:43

Rayon

36.6k5 gold badges54 silver badges78 bronze badges

Collectives™ on Stack Overflow

Javascript method doesn't see object variable

3 Answers 3

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related