Understand Js' 'this'

var person = {

firstName :"Jack",

lastName :"Diff",

showFullName:function () {

console.log (this.firstName + " " + this.lastName);

}

}​

person.showFullName (); // Jack Diff

$ ("#button1").click (function (event) {

console.log ($ (this).prop ("name"));

});

It will return button name of button with selector id : button1

var person = {

  name: 'truong',

 getName : function(callback) {

  console.log(this);  // "this" refers to person object

  console.log(this.name);

  callback();

 }

};

person.getName(function() {

 console.log('closure', this);    // "this" refers to window object

})

// BIND

var person = {

  name: 'truong',

 getName : function(callback) {

  console.log(this); // refer to person object

  console.log(this.name);

  callback();

 }

};

var testClosure = function() {

 console.log('closure', this);   // will refer to person object

}

person.getName(testClosure.bind(person));

// CALL

var person = {

  name: 'truong',

 getName : function(nickname) {

  console.log(this); // window object

  console.log(this.name, nickname); // Global Name my Jack

 }

};

var name = "Global Name";

person.getName.call(window, 'my Jack');

// APPLY

var person = {

  name: 'truong',

 getName : function(callback) {

  console.log(this); // person object

  console.log(this.name); // truong

  callback.apply(window, ['Jack Diff']);

  callback.apply(this, ['Jack Diff']);

 }

};

var nameCallback = function(nickname) {

 console.log(this);

 console.log(nickname);

}

person.getName(nameCallback);