TIL(2/8) / JS 4 (콜백함수, 동기/비동기)

 

콜백함수

함수의 매개변수를 통해 다른 함수의 내부로 전달되는 함수

ex) forEach, setTimeout

제어권을 넘겨줄테니 너가 알고 있는 그 로직으로 처리해줘!

-> 즉, 콜백함수는 다른 코드(함수 또는 메서드)에게 인자로 넘겨줌으로써 그 제어권도 함께 위임한 함수 

-> 콜백함수를 위임받은 코드는 자체적으로 내부 로직에 의해 이 콜백 함수를 적절한 시점에 실행

 

* 고차 함수 : 매개변수를 통해 함수의 외부에서 콜백 함수를 전달받은 함수

 

동기 / 비동기

promise를 async/await으로 리팩토링 해보자!

참조 - 생활코딩 

 

 

<간단하게 보는 차이>

 

1초마다 실행되는 코드를 작성해보았다

  

    
    
    
    
  
function timer(time) {
  return new Promise(function (resolve) {
    setTimeout(function () {
      resolve(time);
    }, time);
  });
}

 

promise로 작성했을 때

  

    
    
    
    
  
console.log("start");
timer(1000)
  .then(function (time) {
    console.log("time : " + time);
    return timer(time + 1000);
  })
  .then(function (time) {
    console.log("time : " + time);
    return timer(time + 1000);
  })
  .then(function (time) {
    console.log("time : " + time);
    console.log("end");
  });

 

async / awiat으로 작성했을 때

  

    
    
    
    
  
async function run() {
  console.log("start");
  var time = await timer(1000);
  console.log("time : " + time);
  time = await timer(time + 1000);
  console.log("time : " + time);
  time = await timer(time + 1000);
  console.log("time : " + time);
  console.log("end");
  return time;
}
async function run2() {
  console.log("parent start");
  await run();
  console.log("parent end");
}
run2();