2020.12.04(금) 개발 일지

개발 일지 2020. 12. 5. 03:11

공부 시간: 09:00 ~ 13:00, 14:00~17:25, 23:30~03:00

1. 노마드코더 코코아 클론코딩 챌린지 day5 퀴즈 풀기

2. 노마드코더의 'ReactJS로 영화 웹 서비스 만들기' 완강 및 2회차 완료

3. 비동기처리에 대한 공부

자바스크립트의 비동기 처리란: 특정 함수를 호출했는데 만약 딜레이가 존재하는 함수였다면? 그 함수가 끝날 때까지 기다리는게 아니라 다음 함수를 이어서 호출하는 특성.
문제점: 네트워크를 통해 얻을 수 있는 리소스를 parameter로 사용하는 함수가 있다고 가정하자. 즉 이 함수를 사용하려면 네트워크와 통신해서 특정 리소스를 받아오는 함수를 선 호출해야한다. 함수는 네트워크와 통신하느라 딜레이가 존재할 것이고 자바스크립트의 비동기처리 방식에 의해 딜레이를 기다리지 않고 다음 함수가 이어서 호출될 것이다. 그래서 함수는 parameter를 받지 못할 것이다.
해결책: 콜백함수, 프로미스, Async/Await 등이 있다. 나열된 순으로 발전된 형태이다. 사용법은 모두 다를지라도 결국 네트워크와 관련된 비동기 처리 문제를 해결하는 것이 목적이다. 어떻게 해결하느냐? 바로 네트워크의 리소스가 필요한 함수의 경우 네트워크 리소스가 불러와진 다음에 호출 되도록 하는 것이다. 이렇게 되면 네트워크 리소스를 기다린 후 호출되므로 호출 시점, 완료 시점 자체는 늦춰질수 있지만 parameter는 제대로 전달 받게 될 것이다. 이해를 좀 더 직관적으로 하기위해 밑의 다이어그램을 직접 만들어 보았다.

<문제상황>

참고 사이트:

자바스크립트 비동기 처리와 콜백 함수

(중급) 중급 자바스크립트 개발자가 되기 위한 자바스크립트 비동기 처리와 콜백 함수 이해하기. 콜백 지옥과 해결 방법 등

joshua1988.github.io

자바스크립트 Promise 쉽게 이해하기

(중급) 자바스크립트 입문자를 위한 Promise 설명. 쉽게 알아보는 자바스크립트 Promise 개념, 사용법, 예제 코드. 예제로 알아보는 then(), catch() 활용법

joshua1988.github.io