[🌳javascript] 콜백함수

콜백함수 실행하는 법.
파라미터안에 함수명/함수선언 넣어주고 1번으로 실행할 함수 {}안에 2번으로 실행할 함수() 넣어줌.
그리고 1번 함수 호출하셈. 이건 이해고 자시고 그냥 외우면 됨.

function 첫째함수(어쩌구함수){
  console.log(1)
  어쩌구함수()}

function 둘째함수(){
  console.log(2)}

첫째함수(둘째함수)// 1
             // 2

첫째함수(둘째함수)처럼 함수명을 넣어줘도 되고 아니면

첫째함수(function(){
	둘째함수()})

이렇게 파라미터 안에서 아예 함수를 만들어 넣어줘도 된다.
근데 이렇게 얌전하게 둘째함수만 넣으면 문제가 없는데,
인간의 욕심은 끝이 없는지라 1번 함수->2번 함수->3번 함수->4번 함수->..이렇게 넣어서
순차대로 실시하고 싶은 마음이 드는 것이다.

function 첫째함수(구멍) {
  console.log(1);
  구멍();
}
function 둘째함수(구멍1) {
  console.log(2);
  구멍1();
}

function 셋째함수(구멍2) {
  console.log(3);
  구멍2();
}
function 넷째함수() {
  console.log(4);
}

첫째함수(function () {
  둘째함수(function () {
    셋째함수(function () {
      넷째함수();
    });
  });
});

이렇게 콜백지옥이 탄생하였다.
이렇게 되면 콘솔에 1 2 3 4 가 차례대로 출력은 되지만 가독성이 매우매우 현저히 떨어진다는 단점이 있다.
그래서 이 난관을 헤쳐나가는 방법으로 두 가지를 소개하려 한다.
(1) Promise
(2) async/ await

글이 길어질 것 같으니 다음장으로 고고~!