Понимание JavaScript: вызов, применение и связывание методов

Мы все знаем о «этом» в JavaScript. Он ссылается на глобальный контекст, или на объект, или может ссылаться на объект, для которого вызывается функция.

Так что, если мы хотим изменить значение “this”. Это означает, что мы хотим изменить контекст выполнения функции.

call(), apply() и bind() — это методы, которые у нас есть. Методы call(), apply() были представлены в ES3, а метод bind() — в ES5. Все эти методы доступны в функции.

вызов() и применение()

методы call() и apply() почти одинаковы. Разница заключается в параметре, который он принимает.
Мы используем эти методы для изменения контекста и выполнения функции, как только мы их вызываем.

Аргументы call() и apply()

Оба этих метода принимают два типа аргументов: первый — это новый контекст, с которым мы хотим выполнить вызывающую функцию, и параметры или аргументы, ожидаемые функцией.

Мы используем call(), когда знаем количество аргументов, которые ожидает вызывающая функция, и мы используем apply(), когда мы не уверены в количестве аргументов, которые вызывает функция. вызывающая функция ожидает, поэтому мы передаем их в массив.

давайте быстро посмотрим пример

var contextObj  = {
contextName: "New Context"
};
function exampleForCallandApply(arg1, arg2, arg3) {console.log("Context Changed",this.contextName, "and arguments are",arg1,arg2,arg3);
}
// call
exampleForCallandApply.call(contextObj,"arg1","arg2","arg3");
//apply
exampleForCallandApply.apply(contextObj,["arg1","arg2","arg3","arg4"]);

Посмотрите, как аргументы передаются в метод call(). Второй аргумент для вызова — это аргументы, ожидаемые функцией, а для apply() второй аргумент — это массив аргументов.

связать()

bind() возвращает ту же функцию обратно после изменения контекста этой функции. В отличие от call() и apply(), она не выполняет функционировать немедленно. Он принимает только один аргумент, который является объектом контекста, который мы хотим присвоить функции, и возвращает ту же функцию, которую мы можем выполнить позже, сохранив ее в переменной.

Вот пример

var contextObj  = {
contextName: "New Context"
};
function exampleForbind(arg1, arg2, arg3) {console.log("Context Changed",this.contextName, "and arguments are",arg1,arg2,arg3);
}
var bindReturnedFunction = exampleForbind.bind(contextObj);
bindReturnedFunction("arg1","arg2","arg3");