이번 포스팅에선 Javascript-비동기 처리에 관한 주요 내용을 다루기보단 목차와 포스팅의 흐름 위주로 작성하고자 한다.
( 먼저 내용을 시작하고 뒤 늦게 머릿말을 적은 거에 관해 양해부탁드립니다.)
작성자 본인의 첫 velog 포스팅으로 Javascript-비동기처리
에 관해 다루기로 하였고 이 부분은 자바스크립트 데이터 통신에 있어서 그 무엇보다 중요하기 때문에 여러 포스팅으로 나누어서 작성하고자 한다. Javascript로 단순히 css를 제어하는 것에는 "asynchronous"란 단어가 그렇게 중요하지 않지만 우린 분명 Json을 활용한 데이터 통신 및 여러 하드한 작업을 나중에 수행하게 될 것이다.
그러기 위해선 비동기처리란 무엇인지, callback 함수란 무엇인지 더 나아가 Promise함수는 왜 등장하였고 어떻게 쓰이는지에 관해 원천적인 개념을 잡을 필요가 있다고 생각한다.
사실 본인도 자바스크립트를 막 공부하기 시작한 입장으로 아무 생각없이 calback함수와 Promise를 사용하다 보니 정작 실제적 코드를 작성할 때 상당히 어려움을 느꼈다.
물론, 이번 포스팅 시리즈 안에서는 Json기반의 Ajax통신에 대해서 깊게 다루지는 않겠지만 모든 포스팅이 끝난 후 비동기 처리의 꽃이라 할 수 있는 Ajax 데이터 통신에 대해서도 다루고자 한다.
앞으로 작성하고자 하는 Javascript - 비동기 처리 포스팅의 전체적 흐름과 내용은 생활코딩 - Javascript Promise (callback & async-await) 기반으로 진행하고자 한다.
또한 세부적인 내용은 Javascript-MDN 공식 사이트를 참조하였다.
유튜브에 검색하면 나오니 포스팅을 보다가 이해가 되지 않은 점이 있다면 꼭 영상을 참조하기 바란다.
좋은 영상을 남겨주신 "이고잉" 님께 항상 감사하고 감히 내용을 요약한 포스팅을 진행하고자 한다.
간단히 시리즈에 관한 순서를 말하자면
Javascript의 비동기 처리
- Callback함수
- Promise란 무엇인가
- new Promise - Promise 생성하기
- async-await 란 무엇인가?
- callback to Promise
- Promise to async-await
- 최종정리
( !! 이번 포스팅은 단순히 "Javascript의 비동기 처리" 시리즈의 목차와 진행방향을 알려주기 위한 내용이므로 본 내용을 읽기 전 참조해주시면 고맙겠다. 늦게 작성한 만큼 포스팅 순서가 뒤바껴저있으니 꼭 시리즈 목차 순서대로 읽어주면 감사하겠습니다.)