«Понимание Javascript» — это серия постов, которые я разработал для всех новичков, которые изо всех сил пытаются освоить все основные концепции JS, поэтому здесь я попытался сделать эти концепции интересными и легкими для понимания. Приятного обучения!

Прежде чем перейти к Call, Apply и Bind, давайте немного вспомним —

ключевое слово "это" -

Каждая функция имеет доступ к свойству, называемому this в javascript, но как его использовать? Таким образом, «это» в каждой функции относится к объекту, вызвавшему эту конкретную функцию. Давайте проверим пример -

var person1 = {
   firstname: 'Tom',
   lastname: 'Harry',
   getFullname: function() {
     console.log(this.firstname + ' ' + this.lastname)
   }
}
person1.getFullname(); // o/p - Tom Harry

В приведенном выше примере, когда мы вызываем getFullname() с использованием человека, человек становится вызывающим объектом, а «это» относится к человеку в области действия функции getFullname.

Метод вызова () -

Теперь рассмотрим предыдущий пример, мы могли бы захотеть использовать эту функцию с именем getFullname для вывода имен нескольких других людей, поэтому мы помещаем это определение функции для каждого нового человека, которого мы создаем, есть ли возможность, что мы можем использовать одну и ту же функцию для нескольких лиц. Да! Вы можете, это магия вызова. Давайте проверим пример

var person1 = {
   firstname: 'Tom',
   lastname: 'Harry',
   getFullname: function() {
     console.log(this.firstname + ' ' + this.lastname)
   }
}
var person2 = {
   firstname: 'Mary',
   lastname: 'Poppins',
}
person2.getFullname.call(person2)// o/p- Mary Poppins

В этом примере вместо того, чтобы снова определить getFullname() в person2, мы повторно используем функцию из person1, изменив значение this. Таким образом, любая ссылка на объект, которую вы передаете в качестве аргумента функции call(), становится значением this в области действия вызываемой функции.

Метод Применить () -

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

var person1 = {
   firstname: 'Tom',
   lastname: 'Harry',
   getFullname: function(args) {
     console.log(this.firstname + ' ' + this.lastname + args[0] +              args[1])
   }
}
var person2 = {
   firstname: 'Mary',
   lastname: 'Poppins',
}
args1 = ['24', 'India'];
args2 = ['25', 'US'];
person1.getFullname.call(person2, args1) 
// o/p - Tom Harry 24 India
person2.getFullname.call(person2, args2)
//o/p - Mary Poppins 25 US

Итак, здесь мы передаем массив некоторых деталей в качестве аргументов, в переменной массива вы можете передать любое количество аргументов.

Метод Bind() —

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

var person1 = {
   firstname: 'Tom',
   lastname: 'Harry',
   getFullname: function() {
     console.log(this.firstname + ' ' + this.lastname)
   }
}
var person2 = {
   firstname: 'Mary',
   lastname: 'Poppins',
}
var getName  = person1.getFullname.bind(person2);
getName(); //o/p- Mary Poppins

Давайте разберем этот пример здесь -

Что именно здесь происходит — person1.getFullname.bind(person2);

Объект, который мы передаем в качестве аргумента, — это person2, поэтому значение this в функции getFullname равно person2, и какая привязка это делает, она сообщает getFullName, что хорошо, братан, значение this здесь будет person2 и возвращает копию функции, которая была привязана к объекту, как выражение для переменной getName. Итак, теперь getName в основном содержит копию функции getFullname(), а свойство this внутри getFullname указывает на person2.

Это некоторые очень базовые понятия, которые, возможно, не используются каждый день, но их знание очень полезно в какой-то момент при написании сложных программ.

Спасибо за прочтение, если было полезно, не забудьте похлопать. И да, вы можете хлопать больше, чем один раз. Если не стесняйтесь оставить комментарий.

Или в случае каких-либо сомнений я доступен через linkdin или instagram