bind

bind
bind() 메서드는 주로 함수 호출 시 this의 컨텍스트를 고정하기 위해 사용된다.
JavaScript에서 this의 값은 함수가 어떻게 호출되는지에 따라 동적으로 결정되기 때문에 혼란을 줄 수 있다.
bind()는 이 문제를 해결하여, 어떤 방식으로 함수를 호출하든 this가 항상 원하는 객체를 가리키도록 만든다.

// 새로운 함수 = 원본 함수.bind(thisArg, arg1, arg2, ...)
const newFunc = originalFunc.bind(thisObject, 'value1', 'value2');

thisObject: newFunc이 호출될 때 this로 바인딩될 객체이다.
arg1, arg2, ...: 원본 함수에 전달할 초기 인자들이다. 이는 부분 적용 기법에 해당된다.

예시

this 컨텍스트 고정하기

객체의 메서드를 다른 곳에 전달할 때 this가 바뀌는 문제를 해결하는 데 유용하다.

const user = {
  name: 'John',
  greet: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

// setTimeout의 콜백 함수로 user.greet를 직접 전달하면
// 'this'가 전역 객체(window)를 가리켜서 name을 찾지 못합니다.
setTimeout(user.greet, 1000); // 출력: Hello, my name is undefined

// bind()를 사용하여 'this'를 user 객체로 고정
const boundGreet = user.greet.bind(user);
setTimeout(boundGreet, 1000); // 출력: Hello, my name is John

부분 적용(Partial Application)

bind()는 첫 번째 인자로 this를, 그 이후 인자로 함수에 전달할 값을 미리 설정할 수 있습니다.

function multiply(a, b) {
  return a * b;
}

// this는 null로 무시하고, 첫 번째 인자(a)를 2로 고정
const double = multiply.bind(null, 2);

console.log(double(5)); // 출력: 10