-
[JS/Asynchronous] Async / Await 다루기Frontend 2019. 8. 10. 23:48
Promise에 이어서 오늘은 Async/Await에 대해서 정리해보려고 한다. Async/Await Async/await은 ES8에서 새롭게 도입되었다. async/await은 promise를 좀 더 이해하기 쉽게 사용하기 위해서 탄생하였다. 그러니까 promise와 전혀 다른 별개의 개념이 아니라 promise를 간단하게 사용하기 위한 문법인 것이다. 그래서 async/await은 기존에 우리가 알던 promise 구문보다 훨씬 간단한 구조로 되어있다. function makeWordPlural (word) { return new Promise((resolve, reject) => { setTimeout(() => { word += "'s "; resolve(word); }, 1000); }); } ..
-
[JS/Asynchronous] Promise / Promise.all(), Promise.race() 정리Frontend 2019. 8. 10. 17:07
저번에 event loop 포스팅에서 언급했듯이 싱글 스레드 언어인 자바스크립트는 한 번에 한 가지 일 밖에 못한다. 그래서 모든 작업을 동기로 처리하면 데이터를 받아와서 화면에 렌더링할 때 데이터 받아오는 작업을 완료하기 전까지는 렌더링을 할 수 없기 때문에 화면이 블록(block)되어 버린다. 그래서 비동기란 것이 생겨났다. 비동기란 일종의 예약 시스템이다. 작업을 동기(Synchronous)로 처리하게 되면 어떤 작업이 끝날 때까지 다음 작업을 진행할 수 없지만 비동기(Asynchronous)로 처리하게 되면 이야기가 달라진다. 어떤 요청을 보내서 응답이 올 때까지 기다려야되는 작업이나 사전에 지정한 시간을 기다려야하는 작업들을 예약을 걸어놓고 지금 당장 처리할 수 있는 작업들을 진행하는 것이다. ..