ES8부터 도입된async, await은 보다 가독성 좋게 비동기 처리를 동기 처리처럼 동작하도록 구현할 수 있는 문법이다. 프로미스를 기반으로 동작하는데, then, catch, finally 의 후속 처리 메서드 없이도 프로미스가 동기처리처럼 처리결과를 반환하도록 구현할 수 있다. async async 키워드를 사용한 함수는 언제나 프로미스를 반환한다. 명시적으로 프로미스를 반환하지 않더라도 async 함수는 암묵적으로 반환값을 resolve하는 프로미스를 반환한다. await await 키워드는 프로미스가 settled 상태가 될 때까지 대기한다. > settled : 비동기 처리가 수행된 상태 그리고 settled 상태가되면 프로미스가 resolve한 처리결과를 반환한다. 예를 들어보자. await 키워드는 fetch 함수가 요청한 응답이 도착해서, fetch 함수가 반환한 promise가 settled 상태가 될 때까지 대기한다. 이후 settl

이런 ESLint의 경고 메시지를 받았다. ` Effect 콜백함수는 race condition을 방지하기 위해 동기적이어야 하기 때문에, 비동기 함수를 콜백함수 내부에 넣는 것을 제안하고 있다. > 무슨 의미일까? Race condition? 다중 프로세스 환경에서 두 개 이상의 프로세스가 동시에 수행 될 때 발생되는 비정상적인 상태 동시에 프로세스가 수행되면 실행 결과의 일관성을 보장하기 어렵다. > 동시에 프로세스가 실행된다는 말이 무슨 의미일까? 여러 개의 비동기 함수를 동시에 실행한다는 뜻이다. 이 경우 매 실행마다 어떤 함수의 결과값이 먼저 리턴될지 보장할 수 없다. 경고메시지가 뜬 부분의 코드는 다음과 같다. 2개의 비동기 함수가 동시에 실행되기 때문인 것 같다. useEffect를 aync로 선언하지 않고 내부에 비동기 함수를 선언해 새로 만들어주었다. 경고 메시지가 사라진 것을 보니, 적절하게 처리한 것 같다.