Pomise

프로미스는 자바스크립트 비동기 처리에 사용되는 객체이다 !

-비동기란 ? 함수가 병렬적으로 실행되는 것을 말한다! 비동기적 명령을 동시에 실행시켰다 하면 각자의 자기 시간표에 맞춰서 실행이 된다! 비동기적은 동시적으로 실행이 되면서 빠른속도로 실행이 가능하게 해준다!

ex) 서버요청 , 통신 할 떄 많이 쓰임 페이지를 먼저 리로드 시키고 서버에 데이터를 받아온다!

다시 돌아와 Promise 는 주로 서버에서 받아온 데이터를 화면에 표시할 때 많이 쓰인다

// promise  
new Promise(function(resolve, reject){
    setTimeout(function() {
      resolve(1);
    }, 2000);
  })             //promise 객체를 출력한다
  .then (function(result){
    console.log(result);    // 1
    return result + 10     //result = 1 + 10  11
   })         //리턴을 해서 프로미스 객체를 호출한다 그러므로 then을 사용할 수 있다    
    .then(function(result) {
        console.log(result)   // 11
        return result + 10   //  result =  11 + 10 = 21  리턴을해서 또 then 을 사용할 수 있다
 })
 .then(function(result){       
    console.log(result);  // 21
 })      

예시로 Promise에서 리턴하면 두가지 함수값을 사용할 수 있다!

1. then(). 에 파라미터는 result 를 알려주고 -> 성공했을때 then으로 전달된 콜백함수가 호출되도록 약속이 되어 있음 콜백함수가 호출되면서 그 결과값이 있으면 첫번째 파라미터로 받을 수 있다 / 결과값으로 response 객체가 전달되었다! 라는걸 알려준다 !

2. catch() 에 파라미터는 reason 캐치 안으로 전달된 콜백함수가 실행되고 실패한 이유를 알려준다

프로미스를 사용하는 이유는 비동기적인 작업을 처리할 때 성공했는지 실패했는지를 표준화된 방식을 이용해서 처리할수 있도록 해준다 //성공시 then , 실패시 catch // 표준화된 방식을 이용해서 알려준다!

async / await

프로미스의 단점을 보완하고 가독성 좋은 코드를 작성하게 도와준다 !
async 는 평범한 함수를 프로미스를 리턴하는 비동기적인 함수로 만들어주는 키워드이고
그렇기 때문에 함수안에서는 await 를 사용할 수 있게 해준다 왜냐 비동기적이니깐!

ex)

async await은 함수 안에서 사용이 가능하다 
async function run() {
  console.log("start");
  let time = await timer(1000);
  console.log("tome" + time);
  time = await timer(time + 1000);
  console.log("tome" + time);
  time = await timer(time + 1000);
  console.log("end");
}
console.log('parent start');
run();

비동기적인 함수앞에 이 함수가 실행되는걸 기다려줘라 해서 await을 붙임