Методи функцій bind / call / apply — навіщо і в чому різниця?

Повне пояснення

Що це і навіщо

• Методи bind, call та apply дозволяють явно встановити контекст (this) при виконанні функції. Це корисно, коли потрібно передати метод об’єкта як колбек або змінити контекст у функціях, що працюють із this.

Ключові принципи/терміни

• bind(thisArg, ...args) повертає нову функцію з прив’язаним контекстом thisArg і попередньо заданими аргументами.
• call(thisArg, arg1, arg2, ...) викликає функцію одразу з контекстом thisArg і списком аргументів.
• apply(thisArg, argsArray) викликає функцію одразу з контекстом thisArg і масивом аргументів.

Як це працює

• При виклику bind створюється замикання, яке зберігає посилання на оригінальну функцію і контекст. Коли нова функція викликається, вона передає збережений this і аргументи до оригіналу.
• call та apply працюють одразу: вони змінюють контекст виконання функції на момент виклику.

Практика і реалізація

const obj = { value: 42, get() { return this.value; } };
const boundGet = obj.get.bind(obj); // new function
console.log(boundGet()); // 42

function sum(a, b) { return a + b; }
sum.call(null, 1, 2); // 3
sum.apply(null, [3, 4]); // 7

Тестування

• У Jest можна перевірити контекст:

test('bind preserves this', () => {
  const obj = { x: 10, fn() { return this.x; } };
  const fn = obj.fn.bind(obj);
  expect(fn()).toBe(10);
});

Особливості в контексті JS/TS Core

• У TypeScript типи this можна явно оголосити, що допомагає уникнути помилок при використанні bind.
• У функціях, що не використовують this, ці методи надлишкові.

Оптимізація, типові помилки та edge cases

• bind створює нову функцію, що може впливати на пам’ять при великій кількості викликів.
• apply приймає масив, тому при великому кількості аргументів варто розглянути call.
• Якщо передати null або undefined як thisArg, контекст буде встановлено на глобальний об’єкт (Node.js – global, браузер – window).