The basics of JavaScript Call, Apply, and Bind

In Javascript, you might have heard or seen the Call, Apply, or Bind function being used in some code. There are some programmers new to coding who see them and want to know how they work. They are commonly seen in function, calling function, and object constructors. They can run functions like how you would normally run a function, though it is a bit different when you use Call, Apply, or Bind. It’s still the same when you run it. If it's True, why would you want to use Call, Apply, or Bind?

Like most functions, they were created with a specific goal in mind. For example .forEach() and .map() both can loop through an array. .map() will return a new array while .Foreach() doesn't. It instead runs a function on each value. Call, Apply, and Bind can run function normally but each one does something different.

JavaScript was created as a simple scripting language for front-end web development. It was created in 1996 by Brendan Eich. He also added some simple functions in JavaScript to help programmers. Throughout all the versions these functions never change. Javascript is also built into every computer, phone, and tablet. So, there is no need to download any extra software to use Javascript. If you want to use Javascript in Chrome just follow these steps.

Click the Chrome menu button
Click the "Settings" menu item
Search for the JavaScript settings
Click "Site settings
Click the JavaScript settings item
Change the JavaScript setting
Use or block JavaScript only on certain websites

.Call()
The first is Call, it will take in an object and pass it in as an argument. Those values in the object can only be called by using this, since the object is not being passed in as a normal argument.

function example(){
console.log(this.value);
}
example.call({value:'test'});
//result:  'test'

.Apply()
The second is Apply, Similar to .Call() but the second parameter will be an array. It will loop through all values in that array. The values for the object will not repeat.

function example(...numbers){
console.log(this.value);
numbers.forEach(num){
console.log(num);
}
}
example.apply({value:'test'}, [1, 2, 3]);
//result:  'test'
//          1
//          2
//          3

.Bind()
Finally, it's bind. Similar to .Call() but it creates a new function based on another function. Similar to the original function but is different.

function example(){
console.log(this.value);
}
const newExample = example.bind({value:'test'})
// newExample now equal
// newExample(){
// console.log('test');
// }

This makes it easier to make objects than just hard-coding
multiple lines of code to make the function return an object.
Now let's say you have multiple object constructors, person and
job. You want both to work with the same values and have clean code. If you use Call to run an object constructor in another object constructor, it will run like the two separate object constructors are one.

const person = function(name){
this.name = name;
}
const job = function(name, job)
person.call(this.name)
this.job = job;
}

const info = job('bob', 'coder')
// result: {name:'bob', job:'coder'}

Now let's look at Two examples of how Apply and Bind are used.

In this screenshot.Apply() is being used in an object constructor. Creating objects that hold information on what type of car it is and how much it costs.

In this screenshot .bind() is being used to help create the front end of a website, by binding a newly created function inside this object as handleCode.