[CORE - JAVASCRIPT] 3. Callback

callback 이란?

Callback 함수는 회신되는 함수
즉 함수를 넘겨, 넘겨준 곳에서 함수를 실행한다는 의미이다.

A라는 함수를 B함수에게 넘겨 A함수의 실행 시점 및 실행의 권한을 B함수가 가지게 되며, B함수가 실행하게 되는 의미이다.

쉽게 말하면 함수를 넘기고 받은 함수에서 함수의 실행 권리 및 실행 시점을 정한다.

넘겨주는 것들 (제어권)

넘겨주는 제어권에는 아래와 같은 3가지가 있다.
1. 실행시점
2. 매개변수
3. this

실행 시점

var cb = function () {
  console.log("초마다 실행");
};
setInterval(cb, 1000);
//setInterval에게 cb의 제어권을 넘겨줘서 setInterval이 실행함

매개변수

var arr = [1, 2, 3, 4, 5];

var entries = [];

arr.forEach(
  function (v, i) {
    entries.push([i, v, this[i]]);
  },
  [10, 20, 30, 40, 50]
);
console.log(entries);
//forEach method에는 첫번째 인는 콜백, 2번째 인는 thisArg
//그래서 this는 [10,20,30,40,50]이 된다.

this

document.body.innerHtmL = '<div id="a">abc</div>';

function cbFunc() {
  console.log(this, x);
}

document.getElementById("a").addEventListener("click", cbFunc);

! 콜백은 함수 !

var arr = [1, 2, 3, 4, 5];

var obj = {
  vals: [1, 2, 3],
  logValues: function (v, i) {
    if (this.vals) {
      console.log(this.vals, v, i);
    } else {
      console.log(this, v, i);
    }
  },
};

obj.logValues(1, 2); // 메서드로 호출 this = obj
arr.forEach(obj.logValues); // 콜백 함수로 넘긴것, this = window 객체

//this를 obj로 하고싶다면?
arr.forEach(obj.logValues, obj);
arr.forEach(obj.logValues.bind(obj));