+++ draft = false +++

Higher Functions, Callbacks

  • Higher function are functions that operate on other functions (by taking them as arguments or returning them)

  • this refer to global object

var fullName = function () {
  setTimeout(function () {
    // `this` will refer to global object
    console.log(this.firstName + " " + this.lastName);
  }, 1000);
};
fullName.call({
  firstName: "Ho",
  lastName: "Hai",
}); // undefined undefined
  • Can fix by hacking
    • Option 1: store this object in higher function
var fullName = function () {
  let that = this;
  setTimeout(function () {
    // `this` will refer to global object
    console.log(that.firstName + " " + that.lastName);
  }, 1000);
};
fullName.call({
  firstName: "Ho",
  lastName: "Hai",
});
  • Using bind: will create new method with binding the this object from higher function
var fullName = function () {
  setTimeout(
    function () {
      // `this` will refer to global object
      console.log(this.firstName + " " + this.lastName);
    }.bind(this),
    1000
  );
};
fullName.call({
  firstName: "Ho",
  lastName: "Hai",
});
  • Or can fix by using Arrow functions

Arrow functions

  • Minimal syntax
  • Solve this problem
var fullName = function () {
  setTimeout(() => {
    // `this` will refer to global object
    console.log(this.firstName + " " + this.lastName);
  }),
    1000;
};
fullName.call({
  firstName: "Ho",
  lastName: "Hai",
});