Не работает функция с замыканием

function bind(context, fn) {
    return function (... args) {
        fn.apply(context, args);
    }

}
    function logPerson() {
        console.log(`Person: ${this.name},${this.age}`)
    }

const person1 = {name: 'Михаил', age: '20'};
const person2 = {name: 'Виктор', age: '21'};

bind(person1, logPerson());
bind(person2, logPerson());

Уважаемые. Не поливайте, пожалуйста грязью. Я только учусь и пытаюсь разобраться. Изучаю замыкания. Посмотрел ролик на ютубе на эту тему по ссылке: https://www.youtube.com/watch?v=pahO5XjnfLA&t=575s и в строчке нашел ошибку. Верным оказалось: "bind(person2, logPerson)();". Объясните, пожалуйста, в чем разница при указании функции, когда вызываешь ее со скобками и без скобок? И что за пустые скобки в конце строки, после указания параметров функции bind?


Ответы (2 шт):

Автор решения: Leonid

Если используется синтаксис someFunction() в качестве параметра функции, то в функцию будет передан возвращаемое значение этой функции. В вашем случае вызов logPerson() ничего не возвращает, значит в bind будет передано undefined в качестве второго параметра. Напомню, что надо передавать функцию как объект.

Если используется синтаксис bind(person1, logPerson) то в bind передается не результат вызова функции, а сама функция. То есть ссылка на функцию. В дальнейшем fn.apply(context, args) преобразует выражение в fn(args) то есть в вашем случае в logPerson(args); Внутри этих функций this будет указывать на person1.

Если используется синтаксис bind(person1, logPerson)(), то функция, возвращаемая bind будет вызвана. В нашем случае logPerson() c person1 в качестве this.

function bind(context, fn) { // Принимает объект и переменную, хранящую ссылку на функцию
    return function (...args) { // Возвращает функцию, принимающую ...args
        fn.apply(context, args); // Функция вызывает переданную ей функцию fn в контексте объекта context с аргументами args
    }

}
function logPerson(...args) { // ...args здесь и выше преобразование всех передаваемых функции параметров в массив args
    console.log(`Person: ${this.name},${this.age}`);
    console.log(args);
}

const person1 = {name: 'Михаил', age: '20'};
const person2 = {name: 'Виктор', age: '21'};

bind(person1, logPerson)(1,2,3); // Скобки в конце это вызов возвращаемой функции с аргументами 1,2,3
bind(person2, logPerson)(4,5,6);

→ Ссылка
Автор решения: Igor

function bind(context, fn) {
  return function(...args) {
    fn.apply(context, args);
  }
}

function logPerson() {
  console.log(`Person: ${this.name}, ${this.age}`);
}

const person1 = {
  name: 'Михаил',
  age: '20'
};
const person2 = {
  name: 'Виктор',
  age: '21'
};

var f1 = bind(person1, logPerson);
var f2 = bind(person2, logPerson);

f1();
f2();

→ Ссылка