옵셔널 체이닝과 async await

최근에 비동기에 관한 문제들을 정말 많이 만났다.

주로 데이터를 받아오는 시간을 기다리지 못하고 값을 내뱉어버리는 오류를 많이 만났다.

그 때 해결방법으로 내세웠던 것들이 if문으로 해결하는 것이였는데 이는 약간 임시방편적인 느낌이 들었다.

찾아보니 옵셔널 체이닝과 async await으로도 해결 가능함을 확인해서 알고있으면 좋을 것 같아 포스팅 하기로 한다.

옵셔널 체이닝과 async await은 처음 들어보는 것은 아니고 이전에 포스팅한적도 있지만 그때랑 지금이랑 느끼는게 다른 것 같다.

 

옵셔널 체이닝

 

옵셔널 체이닝 ?.을 사용하면 프로퍼티가 없는 중첩 객체를 에러 없이 안전하게 접근할 수 있다.

?.는 ?. 앞의 평가 대상이 undefined나 null이면 평가를 멈추고 undefined를 반환한다.

 

async await

 

async

 

async와 await을 사용하면 Promise를 좀 더 편하게 사용할 수 있다.

async function() 이런식으로 함수 앞에 async를 붙이게 되면 해당 함수는 항상 promise를 반환한다.

프라미스가 아닌 것은 프라미스로 감싸 반환한다.

 

await

 

await은 async 함수 안에서만 동작한다.

자바스크립트는 await 키워드를 만나면 프라미스가 처리될 때까지 기다리고, 결과는 그 이후 반환한다.

즉, awiat은 말그대로 프라미스가 처리될 때까지 함수 실행을 기다리게 만들고 프라미스가 처리되면 그 결과와 함께

실행이 재개되게 하는 것이다. 

(프라미스가 처리되는 동안에는 엔진이 다른 일을 처리할 수 있기 때문에 리소스가 낭비되지 않는다.)