метод функций aplly

Вопрос-ответ JavaScript
1

Плохо понятен код, а именно как работает метод apply

    Function.prototype.defer = function(delay){
        var f = this;
        return function (second, brackets){
	    var args = arguments;
	    var context = this;
	    setTimeout( function(){
		   f.apply(context, args);
	    }, delay );
        };
    };
   function f1(a, b) {
     console.log( a + b );
   }

  f1.defer(2500)(3, 2); // Output 3 after 1 second

Создается метод в прототипе функции выполняющий вызов функции выполняющую возврат суммы аргументов с задержкой.

  1. Во внешней функции запоминается функция в контексте которой выполняется appy

2; Возвращается внутренняя функция - запомнили контекст и псевдомассив аргументов

3 Устанавливается задержка выполнения функции

4 Выполняется метод apply для функции f1 через переменную f, в параметры apply передаются аргументами контекст this и псевдомассив аргументов из внутренней замыкающейся функции
5 метод apply выполняет неведомую хрень _о_/
6 получается результат
Кто понимает объясните как работает apply.
Как я понимаю выполняет функцию f с аргументами переданными в параметре apply в контексте context
Если это верно, то что такое “в контексте context”?
Спасибо

2

.apply - это один из способов вызвать функцию. Самый распространенный - это круглые скобки.

function f() {console.log('f');}
f(); // 'f'

apply делает тоже самое, что и вызов функции. Разница в том, что при вызове функции с помощью apply, внутри функции this будет ссылаться на первый аргумент, переданный в apply.

function f() {
    console.log(this);
}
var object = {test: true}
f.apply(object); // {test: true}

Еще одна разница между вызовом через apply и круглые скобки в том, что элементы из массивоподобного объекта, который может быть вторым аргументом, будут подставлены на соответствующие места аргументов функции.

function f(a, b, c) {
    console.log(a, b, c);
}
var object = {test: true}
f.apply(null, ['uno']); // 'uno', undefined, undefined
f.apply(null, ['uno', 'tuo']); // 'uno', 'tuo', undefined
f.apply(null, ['uno', 'tuo', 'tre']); // 'uno', 'tuo', 'tre'

В конкретном примере в переменную context - записан this, который был внутри функции function (second, brackets){ при ее вызове. Он используется для того чтобы сохранить this, той функции, внутри которой запускается таймаут. В общем код решает проблему, которая тебе может быть еще не ясна, но сделано все корректно.

Без сохранения контекста (не получилось бы взять this.name) и передачи аргументов (не получилось бы передать аргумент toWhom) вот такая конструкция не заработала бы как ожидалось. (надо предварительно запустить код из примера, который в прототип функции дописывает метод defer)

function Cat(name) {
	this.name = name
	this.mew = this.mew.defer(2000)
}

Cat.prototype.mew = function(toWhom) {
	console.log(this.name + ' mewing to ' + toWhom)
}

var fluffy = new Cat('Fluffy')
fluffy.mew('Fred')
1 лайк