JavaScript - это динамический язык, который достаточно гибок, чтобы позволить вам делать такие вещи, как множественное наследование. В этом случае объект или класс могут наследовать характеристики более чем от одного родителя. Это можно сделать одним из трех методов: call / apply / bind. Прочтите ниже или попробуйте сами, клонировав код здесь.
Так в чем разница?
Вызов
Допустим, у нас есть объект с именем obj. У него есть только одно свойство с именем things, которое имеет значение 3. Совершенно не связанное с этим объектом, давайте также создадим функцию с именем addThings.
let obj = {things: 3}; let addThings = function(a, b, c){ return this.things + a + b + c; };
Обратите внимание на this.things. Почему функция addThings упоминает это, когда у нее даже нет вещей? Нам нужно передать ему контекст. Мы можем сделать это с помощью call. Если бы мы запустили этот код:
console.log( addThings.call(obj, 1,4,6) );
Он вернет число 14.
Это потому, что первый параметр, который принимает вызов, - это контекст, на который мы хотим ссылаться с помощью this ”. Мы передали ему obj, у которого есть свойство things. После передачи контекста мы можем передавать аргументы, как обычно. В этом случае мы прошли 1, 4, 6. Итак, эта строка:
return this.things + a + b + c;
будет заполнен следующим образом:
return 3 + 1 + 4 + 6;
В результате 14.
Вот что делает call! Давайте посмотрим на метод применить.
Подать заявление
apply настолько похож на call, что я лично не вижу его ценности. Каламбур предназначен.
Я объясню это, так как вам может понадобиться узнать об этом на собеседовании. Основное отличие заключается в способе передачи аргументов. Мы можем передать их как массив. Удалите предыдущий код из головы и давайте начнем заново.
let obj = {things: 3}; let addThings = function(a, b, c){ return this.things + a + b + c; }; let arr = [1,4,6]; console.log( addThings.apply(obj, arr) );
Теперь давайте посмотрим на Bind.
Связывать
let obj = {things: 3}; let addThings = function(a, b, c){ return this.things + a + b + c; }; console.log( addThings.bind(obj, 1,4,6) );
Мы ожидали числа 14, но это не сработало. Вместо этого он вернул функцию. Привязка работает, возвращая копию функции, но с другим контекстом. Мы передали obj в качестве контекста, но не выполнили его. Давайте попробуем это:
console.log( addThings.bind(obj, 1,4,6)() );
Это сработало! Мы также можем передать такие аргументы:
console.log( addThings.bind(obj)(1,4,6) );
Вот и все! Теперь вы знаете о вызове / заявке / привязке. А теперь иди и примени его (хромой)!
Удачного кодирования,
Иван