.bind(), .call(), .apply(), and currying and how they work

/ Copy this post into your text editor between the scripts or use your browsers console. We will take a look at the .call(), .apply() and .bind() which are methods and how they work. A function is an object so it can have properties and methods. So if I have an object with two properties and a method that uses the ‘this’ key word. It is a method of an object and it will point to the object. The object that contains the method. Lets take a look at how this works. And also what is currying and how it works.

var person = {
firstname: ‘John’,
lastname: ‘Doe’,
getFullName: function(){

    var fullname = this.firstname + " " + this.lastname
    return fullname;
}

}

var logName = function(lang1, lang2) {
console.log("logged: " + this.getFullName());
console.log("Argument: " + ’ ’ + lang1 + lang2);
console.log(’----------------’);
} .bind(person);

//This will give an error because it is not a method of the global object. But what if I can control what “this” points to

//logName();

var logPersonName = logName.bind(person); //All function objects can call a method of either bind(), apply(), or call(). So now I bind the person object to logName and then call it with a new variable

logPersonName('english and ',‘spanish’);

//now call() actually executes the function on the fly instead of making a copy of the function as we did with the .bind method call

logName.call(person, "english  and ", "spanish");

//Here we use the method call apply() in the same way but we get an error message because we cannot add the parameters in the same way.  They require it to be added as an array.  All else is the same

//LogName.apply(person,'english  and ', "Spanish");


logName.apply(person,['Spanish  and  ','English']);

//Function borrowing is when I can take the person.getFullName and apply it using the var person it will will chnage the object of peron.getName attributes to person2 on the fly.

var person2 ={
firstname: “Imhotep”,
lastname: “Amen Ra El”
}

console.log(person.getFullName.apply(person2));

//To perform function “currying” we can take the “this” global value and bind it to a new function. Lets take an example:

function multiply(a,b){
    return a*b;
}

// Here when we copy the function and we take the global object “this” and bind it as the first parameter. We then only then need to add the second parameter to call the function

var multiplyByTwo = multiply.bind(this,2);

console.log(multiplyByTwo(8));

//Or I can pass both parameter and make them permanent like:

var multiplyByTwo = multiply.bind(this, 2, 2);// And when I cansole.log it does not matter what parameters I use.   In the function they are set at 2,2 and when multiplied will give you "4" no matter what arguments you use.

console.log(multiplyByTwo(8,9));


//Or I can just leave both parameter open by only binding  or making a copy of the function and it will operate as the original function

var multiplyByTwo = multiply.bind(this);  

console.log(multiplyByTwo(4,5));

// This will simply multiply the two parameters and give the result. This is Currying - Creating a copy of a function but with some preset parameters. This is very useful in mathematical situations.

1 Like