"Variables has local and global scopes.Let's suppose that we have two variables
with the same name.One is globally defined and the other is defined inside a
function closure and we want to get the variable value which is inside the
function closure.In that case we use thisbind() method.code:var x =9;// this refers to global "window" object here in the browservar person ={x:81,// local variable x = 81getX:function(){returnthis.x;// "this" = person , so this.x is the same as person.x}};// the next line of code is the most important one (line 17)var y = person.getX;// It will return 9, because it will call global value of x(var x=9).var myFunc = y.bind(person);// It will return 81, because it will call local value of x, which is defined in the object called person(x=81).y();// return 9 (the global variable);myFunc();" // return 81 (the loacl variable);
let obj ={name:"Abhi",age:28,info:function(){console.log(`${this.name} is ${this.age} year's old`);//template literals used here},};let obj1 ={name:"Vikash",age:28,};
obj.info.bind(obj1)();//since bind methods return a new function so //we can directly call that function[()] without pollouting global//space while assigning a varibale to call that function.//Always try to make global space neat n clean ,//dont polloute while assigning unnecessary variables.
const person ={name:"John Smith",getNameAndAddress:function(){returnthis.name;}}const personWithoutGet ={name:"Jerry Smithers"}console.log(person.getName.bind(personWithoutGet);}/*you can think of bind() apply() and call() ALL as "stealing someone else's function to use."*//* victimBeingStolenFrom.functionName.call(theThief) *//*notice the second variable personWithoutGet does not have a getName function*/
var myButton ={content:'OK',click(){console.log(this.content+' clicked');}};
myButton.click();var looseClick = myButton.click;looseClick();// not bound, 'this' is not myButton - it is the globalThisvar boundClick = myButton.click.bind(myButton);boundClick();// bound, 'this' is myButton
const person ={firstName:"John",lastName:"Doe",fullName:function(){returnthis.firstName+" "+this.lastName;}}const member ={firstName:"Hege",lastName:"Nilsen",}let fullName = person.fullName.bind(member);
var car ={registrationNumber:"FT5142",brand:"Benz",displayDetails:function(){console.log(this.registrationNumber+" "+this.brand);}}
car.displayDetails();var myCarDetails = car.displayDetails.bind(car);myCarDetails();
var persona ={nombre:'Franco',apellido:'Chequer',getNombre:function(){var nombreCompleto =this.nombre+' '+this.apellido;return nombreCompleto;}}varlogNombre=function(){console.log(this.getNombre());}var logNombrePersona = logNombre.bind(persona);logNombrePersona();//'Franco'
(function(){const student ={name:'John',getName:function(){returnthis.name;}}let theName =student.getName.bind(student);console.log(theName());})()/*use bind when you have a function(not one created from a class) that requires a this, and you add the this candidate inside of bind*/