📘 콜백 함수

📖 콜백 함수란?

• 다른 코드의 인자로 넘겨주는 함수.

• 받는 함수 존재.(forEach, setTimeout 등) 콜백 함수의 제어권을 가짐.

• 즉, 콜백 함수는 다른 코드에게 인자를 넘겨주면서 제어권도 일임한 함수.

📖 제어권

• 호출 시점에 대한 제어권을 갖는다.

• 인자에 대한 제어권을 갖는다.

• 콜백 함수도 함수이기 때문에 this가 전역 객체를 참조한다.

  • 하지만 제어권을 넘겨받을 코드에서 this를 지정한 경우에는 그 대상을 참조한다.

📖 콜백 함수도 함수다

• 콜백 함수로 어떤 객체의 메소드를 전달하더라도 그 메소드는 함수로 호출해야한다.

  var obj = {
       vals: [1, 2, 3],
       logValues: function(v, i) {
           if (this === global) console.log("this가 global입니다.");
           else console.log(this, v, i);
       }
   };
  
   //method로써 호출
   obj.logValues(1, 2);
  
   //callback => obj를 this로 하는 메서드를 그대로 전달한게 아님
   //단지, obj.logValues가 가리키는 함수만 전달
   [4, 5, 6].forEach(obj.logValues);

📖 콜백 함수 내부의 this에 다른 값 바인딩하기

• this 우회

  // closure 방식 - 함수가 끝났음에도 영향을 끼친다.
  var obj1 = {
       name : "obj1",
       func : function () {
           var self = this; //이 부분
           return function () {
               console.log(self.name);
           };
       }
   };
  
   var callback = obj1.func();
   setTimeout(callback, 1000);
  
   // call 즉시 호출로 this 바인딩
   var obj2 = { name : "obj2"};
   var callback2 = obj1.func.call(obj2);
   setTimeout(callback2, 2000);

• bind

  var obj1 = {
       name : "obj1",
       func : function () {
           console.log(this.name);
       }
   };
   
   
   setTimeout(obj1.func.bind(obj1), 1000)
   
   // obj1.func 함수를 실행할 때 this를 obj2로 바인딩
   var obj2 = { name : "obj2"};
   setTimeout(obj1.func.bind(obj2), 1500);