These methods I have encountered much and have a shallow understanding as what they do. However, I’m not aware where when you would use them and was wondering if anyone has applied these methods in a real-world application.
Thanks 
call (and apply) allow you to execute a method within a specific this context. It’s a different way to call a function. "foo".repeat(5) is functionally the same as String.prototype.repeat.call("foo", 10). It is a necessary part of the language (sometimes you have no option but to call something that way, or you have to borrow a method from another context). You may not encounter it that much, it’s very useful though.
apply allows you to pass arguments as an array to a function that expects individual arguments. Eg Math.max takes individual arguments, but say you wanted to find the max of an array, so just use apply to pass an array: Math.max.apply(null, myArray). Note the spread operator has obsoleted that use case (just do Math.max(...myArray)).
bind allows you to create a function that wraps another function in a specific context, so you can execute it later. You’ll see it a lot in JS classes, for example with React, where you have handler functions to deal with clicks etc. Often those are bound in the constructor like this.myHandlerMethod = this.myHandlerMethod.bind(this) , which looks a bit silly, but JS scope is tricky at times, and what that is doing is ensuring that the handler will always be called in the context of the class in which it was defined. Arrow functions make bind a lot less necessary than it used to be.
Call, apply and bind allow you to change the context of a function when it is called.
Call and apply are a different way of executing a function, bind is a way of changing the way a function will be executed.
4 Likes
They’re a bit strange and abstract when you start out. You don’t need them until you need them - describing how they work doesn’t really explain why you’d use them (if that makes sense). It helps to understand how JS works, and how this and scope work. Particularly this - all three let you modify what this refers to when calling a specific function.
They’re kinda all examples of metaprogramming - rather than being code that transforms data, they let you write code that dynamically transforms the code that transforms the data. Kinda up one level of abstraction from everything else. Code that modifies code (other examples include all the Object methods, for..in loops, Proxies and the eval function).
After ES5 no one uses them, so …
Not quite, bind is frequently used in React.js since the components you’re returning still need the class methods bound to them.
No one uses allready. Everyone prefers arrow functions if you are using classes, but after last update in react everyone uses hooks ? So , i think he don’t need it.
I think it is still necessary to understand the concept and how to apply and how to write it though. It helps you easier to understand and read ES5 codes from other devs.
Quang.