«Понимание 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