본문 바로가기
반응형

개발서적/모던 자바스크립트 Deep Dive28

제너레이터와 async/await (모던 자바스크립트 Deep Dive) 46.1 제너레이터란? 코드 블록의 실행을 일시 중지했다가 재생할 수 있는 함수 특징 호출자에게 함수 실행의 제어권을 양도할 수 있다. 함수와 호출자와 양방향으로 함수의 상태를 주고 받을 수 있다. 함수 코드를 실행하는 것이 아니라 이터러블이면서 이터레이터인 제너레이터 객체를 반환한다. 46.2 제너레이터 함수의 정의 function* 키워드로 선언한다. yield 표현식을 포함한다. 화살표 함수로는 정의할 수 없다. 생성자 함수로 호출할 수 없다. 46.3 제너레이터 객체 제너레이터 함수가 반환한 제너레이터 객체는 이터러블이면서 이터레이터다. value, done , next() 를 소유한다. return , throw 도 가진다. function* genFunc() { try { yield 1; yi.. 2024. 4. 17.
프로미스 (모던 자바스크립트 Deep Dive) ES6에서 비동기 처리를 위한 새로운 패턴 프로미스 제시! 45.1 비동기 처리를 위한 콜백 패턴의 단점 콜백 헬 비동기 함수는 동기처리 되는 함수들이 모두 처리되고 나서 마지막에 처리되기 때문에 비동기로 동작하는 코드에서 나오는 결과를 외부로 반환하거나 상위 스코프의 변수에 할당하면 기대한 대로 동작하지 않는다. 동기 함수가 자바스크립트 엔진의 콜 스택에서 모두 처리되어야, 비동기 함수가 태스크 큐에서 꺼내어져 실행이 완료될 수 있다. 비동기 함수는 브라우저 또는 Nodejs에서 이벤트 루프와 태스크 큐에서 따로 관리되기 때문에 그렇다. 그러므로 비동기 함수 내부의 코드를 외부로 반환하거나 상위 스코프에서 할당하면 눈으로 보는 것처럼 동작하지 않을 수 있다. 위와 같은 문제로, 비동기 함수의 처리 결과.. 2024. 4. 17.
Ajax (모던 자바스크립트 Deep Dive) 43.1 Ajax란? Asynchronous JavaScript an XML 자바스크립트를 사용하여 브라우저가 서버에게 비동기 방식으로 데이터를 요청하고 서버가 응답한 데이터를 수신하여 웹페이지를 동적으로 갱신하는 프로그래밍 방식 브라우저에서 제공하는 Web API인 XMLHttpRequest 객체 기반으로 동작한다. 전통적인 브라우저 동작 방식을 전환한 프로그래밍 방식이다. 비동기 방식을 이용해 변경이 필요한 부분만 한정적으로 렌더링한다. 비동기 방식이기 때문에 서버와의 통신에서 블로킹이 사라진다. 43.2 JSON JavaScript Object Notation 클라이언트와 서버간의 HTTP 통신을 위한 텍스트 포맷 자바스크립트만의 데이터 포맷은 아니다. 표기 방식 객체 리터럴과 유사한 키와 값으로 .. 2024. 4. 17.
비동기 프로그래밍 (모던 자바스크립트 Deep Dive) 42.1 동기 처리와 비동기 처리 자바스크립트 엔진은 하나의 실행 컨텍스트 스택을 갖는다. 동시에 2개 이상의 함수를 실행할 수 없다. 하나의 태스크만 실행할 수 있다 → 싱글 스레드 자바스크립트 엔진은 싱글 스레드 방식으로 동작한다. 처리 시간이 걸리는 태스크 실행시 블로킹(작업 중단)이 발생한다. 실행 중인 태스크가 종료할 때까지 다음에 실행도리 태스크가 대기하는 방식을 동기 처리 라고 한다. 순서가 보장되지만 블로킹되는 단점 태스크를 블로킹하지 않고, 곧바로 다음 태스크를 실행하는 방식을 비동기 처리라고 한다. 블로킹은 되지 않지만 순서가 보장되지 않는다. 흔하게 콜백 패턴이 사용된다. 가독성 저하와, 콜백 헬, 예외 처리 어려움 등의 단점이 있다. setTimeout, setInterval, HT.. 2024. 4. 17.
728x90
반응형