(JS) this : bind

Function.prototype.bind

bind메소드는 .call .apply와 약간의 차이가 있습니다.
bind는 특정상황에서 this를 지정해주고 싶을때 사용한다.

function foo() {
  console.log('hello');
}

//bind 메소드는 원본 함수를 복제한 "새로운 함수"를 반환합니다.
const bar = foo.bind();

bar();

위 예제에서는 bind메소드는 foo함수를 실행하지 않는다.
const bar = foo.bind();에서 foo 함수가 실행되는 것은 아니다.

bind메소드는 새로운 함수를 반환한다. 즉, bar변수에 담기는 값이 함수이다.

bind메소드가 반환한 함수를 실행할때, 메소드가 사용된 함수가 실행된다. 즉 bar()가 실행될때 foo함수가 실행되는 것이다.

function foo() {
  console.log(this.age);
}

var hodoo = { age: 10 };

var bar = foo.bind(ken); // .앞에 위치한 foo의 this가ㅣ 아니라 bind된 변수 ken의 age가 this가 된다. 

bar(); 

bar실행문은 foo 함수를 실행하며 this 값은 hodoo가 된다. var bar = foo.bind(ken); 함수의 첫 번째 인자로 들어간 값이 this로 설정되었기 때문이다.

bind 메소드는 "새로운 함수"를 반환한다. 반환된 이 함수를 실행해야 원본 함수가 실행된다.

function foo (a, b, c) {
  console.log(this.age);
  console.log(a + b + c);
}

const hodoo = {
  age: 10
};

const bar = foo.bind(hodoo, 1, 2, 3);

bar(); // 10 출력, 6 출력

bind 메소드는 call 메소드와 유사하게 받을 수 있는 인자의 갯수에 대한 제한이 없다.

첫 번째 인자는 this 값으로 설정되며, 나머지 인자는 모두 메소드가 사용된 함수에 인자로 전달된다.

위의 경우에는 1, 2, 3이 각각 a, b, c로 `foo 함수에 대한 인자로 전달된다.