andilabs
9/8/2017 - 1:57 PM

No binding of thisUntil arrow functions, every new function defined its own this value (a new object in the case of a constructor, undefined

No binding of thisUntil arrow functions, every new function defined its own this value (a new object in the case of a constructor, undefined in strict mode function calls, the base object if the function is called as an "object method", etc.). This proved to be annoying with an object-oriented style of programming.From https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions

new_gist_file.js
content_copyfile_download
function Person() {
  // The Person() constructor defines `this` as an instance of itself.
  this.age = 0;

  setInterval(function growUp() {
    // In non-strict mode, the growUp() function defines `this` 
    // as the global object, which is different from the `this`
    // defined by the Person() constructor.
    this.age++;
  }, 1000);
}

var p = new Person();

//////////////////////////////////////// NEW STYLE /////////////////////////////////////////////////////

function Person() {
  var that = this;
  that.age = 0;

  setInterval(function growUp() {
    // The callback refers to the `that` variable of which
    // the value is the expected object.
    that.age++;
  }, 1000);
}