Return to Answer

The question revolves around how this keyword behaves in javascript. this behaves differently as below,

1. The value of this is usually determined by a function execution context.
2. In the global scope, this refers to the global object (the window object).
3. If strict mode is enabled for any function then the value of this will be undefined as in strict mode, global object refers to undefined in place of the window object.
4. The object that is standing before the dot is what this keyword will be bound to.
5. We can set the value of this explicitly with call(), bind(), and apply()
6. When the new keyword is used (a constructor), this is bound to the new object being created.
7. Arrow Functions don’t bind this — instead, this is bound lexically (i.e. based on the original context)

As most of the answers suggest, we can use Arrow function or bind() Method or Self var. I would quote a point about lambdas (Arrow function) from Google JavaScript Style Guide

Prefer using arrow functions over f.bind(this), and especially over goog.bind(f, this). Avoid writing const self = this. Arrow functions are particularly useful for callbacks, which sometimes pass unexpectedly additional arguments.

Google clearly recommends using lambdas rather than bind or const self = this

So the best solution would be to use lambdas as below,

function MyConstructor(data, transport) {
  this.data = data;
  transport.on('data', () => {
    alert(this.data);
  });
}

References:

1. https://medium.com/tech-tajawal/javascript-this-4-rules-7354abdb274c
2. arrow-functions-vs-bind

The question revolves around how the this keyword behaves in JavaScript. this behaves differently as below,

1. The value of this is usually determined by a function execution context.
2. In the global scope, this refers to the global object (the window object).
3. If strict mode is enabled for any function then the value of this will be undefined as in strict mode, global object refers to undefined in place of the window object.
4. The object that is standing before the dot is what the this keyword will be bound to.
5. We can set the value of this explicitly with call(), bind(), and apply()
6. When the new keyword is used (a constructor), this is bound to the new object being created.
7. Arrow functions don’t bind this — instead, this is bound lexically (i.e., based on the original context)

As most of the answers suggest, we can use the arrow function or bind() Method or Self var. I would quote a point about lambdas (arrow function) from Google JavaScript Style Guide

Prefer using arrow functions over f.bind(this), and especially over goog.bind(f, this). Avoid writing const self = this. Arrow functions are particularly useful for callbacks, which sometimes pass unexpectedly additional arguments.

Google clearly recommends using lambdas rather than bind or const self = this

So the best solution would be to use lambdas as below,

function MyConstructor(data, transport) {
  this.data = data;
  transport.on('data', () => {
    alert(this.data);
  });
}

References:

1. https://medium.com/tech-tajawal/javascript-this-4-rules-7354abdb274c
2. arrow-functions-vs-bind

The question revolves around how this keyword behaves in javascript. this behaves differently as below,

1. The value of this is usually determined by a functions execution context.
2. In the global scope, this refers to the global object (the window object).
3. If strict mode is enabled for any function then the value of this will be undefined as in strict mode, global object refers to undefined in place of the window object.
4. The object that is standing before the dot is what the this keyword will be bound to.
5. We can set the value of this explicitly with call(), bind(), and apply()
6. When the new keyword is used (a constructor), this is bound to the new object being created.
7. Arrow Functions don’t bind this — instead, this is bound lexically (i.e. based on the original context)

As most of the answers suggest, we can use Arrow function or bind() Method or Self var. I would quote a point about lambdas (Arrow function) from Google JavaScript Style Guide

Prefer using arrow functions over f.bind(this), and especially over goog.bind(f, this). Avoid writing const self = this. Arrow functions are particularly useful for callbacks, which sometimes pass unexpected additional arguments.

Google clearly recommends to use lambdas rather than bind or const self = this

So the best solution would be to use lambdas as below,

function MyConstructor(data, transport) {
  this.data = data;
  transport.on('data', () => {
    alert(this.data);
  });
}

References:

1. https://medium.com/tech-tajawal/javascript-this-4-rules-7354abdb274c
2. arrow-functions-vs-bind

The question revolves around how this keyword behaves in javascript. this behaves differently as below,

1. The value of this is usually determined by a function execution context.
2. In the global scope, this refers to the global object (the window object).
3. If strict mode is enabled for any function then the value of this will be undefined as in strict mode, global object refers to undefined in place of the window object.
4. The object that is standing before the dot is what this keyword will be bound to.
5. We can set the value of this explicitly with call(), bind(), and apply()
6. When the new keyword is used (a constructor), this is bound to the new object being created.
7. Arrow Functions don’t bind this — instead, this is bound lexically (i.e. based on the original context)

As most of the answers suggest, we can use Arrow function or bind() Method or Self var. I would quote a point about lambdas (Arrow function) from Google JavaScript Style Guide

Prefer using arrow functions over f.bind(this), and especially over goog.bind(f, this). Avoid writing const self = this. Arrow functions are particularly useful for callbacks, which sometimes pass unexpectedly additional arguments.

Google clearly recommends using lambdas rather than bind or const self = this

So the best solution would be to use lambdas as below,

function MyConstructor(data, transport) {
  this.data = data;
  transport.on('data', () => {
    alert(this.data);
  });
}

References:

1. https://medium.com/tech-tajawal/javascript-this-4-rules-7354abdb274c
2. arrow-functions-vs-bind

The question revolves around how this keyword behaves in javascript. this behaves differently as below,

1. The value of this is usually determined by a functions execution context.
2. In the global scope, this refers to the global object (the window object).
3. If strict mode is enabled for any function then the value of “this” will be “undefined” as in strict mode, global object refers to undefined in place of windows object.
4. The object that is standing before the dot is what the this keyword will be bound to.
5. We can set the value of this explicitly with call(), bind(), and apply()
6. When the new keyword is used(a constructor), this is bound to the new object being created.
7. Arrow Functions don’t bind this — instead, this is bound lexically (i.e. based on the original context)

As most of answer suggests, we can use Arrow function or bind() Method or Self var. I would quote a point about lambdas (Arrow function) from Google JavaScript Style Guide

Prefer using arrow functions over f.bind(this), and especially over goog.bind(f, this). Avoid writing const self = this. Arrow functions are particularly useful for callbacks, which sometimes pass unexpected additional arguments.

Google clearly recommends to use lambdas rather than bind or const self = this

So the best solution would be to use lambdas as below,

function MyConstructor(data, transport) {
  this.data = data;
  transport.on('data', () => {
    alert(this.data);
  });
}

References:

1. https://medium.com/tech-tajawal/javascript-this-4-rules-7354abdb274c
2. arrow-functions-vs-bind

The question revolves around how this keyword behaves in javascript. this behaves differently as below,

1. The value of this is usually determined by a functions execution context.
2. In the global scope, this refers to the global object (the window object).
3. If strict mode is enabled for any function then the value of this will be undefined as in strict mode, global object refers to undefined in place of the window object.
4. The object that is standing before the dot is what the this keyword will be bound to.
5. We can set the value of this explicitly with call(), bind(), and apply()
6. When the new keyword is used  (a constructor), this is bound to the new object being created.
7. Arrow Functions don’t bind this — instead, this is bound lexically (i.e. based on the original context)

As most of the answers suggest, we can use Arrow function or bind() Method or Self var. I would quote a point about lambdas (Arrow function) from Google JavaScript Style Guide

Prefer using arrow functions over f.bind(this), and especially over goog.bind(f, this). Avoid writing const self = this. Arrow functions are particularly useful for callbacks, which sometimes pass unexpected additional arguments.

Google clearly recommends to use lambdas rather than bind or const self = this

So the best solution would be to use lambdas as below,

function MyConstructor(data, transport) {
  this.data = data;
  transport.on('data', () => {
    alert(this.data);
  });
}

References:

1. https://medium.com/tech-tajawal/javascript-this-4-rules-7354abdb274c
2. arrow-functions-vs-bind