본문 바로가기

[Study] Deep Dive 스터디11

[JS] 제너레이터와 async/await 46장 : 제너레이터와 async/await 1. 제너레이터란? ES6에서 도입된 제너레이터(generator)는 코드 블록의 실행을 일시 중지했다가 필요한 시점에 재개할 수 있는 특수한 함수다. 제너레이터와 함수의 차이 제너레이터 함수는 함수 호출자에게 함수 실행의 제어권을 양도할 수 있다. 제너레이터 함수는 함수 호출자와 함수의 상태를 주고받을 수 있다. 제너레이터 함수를 호출하면 제너레이터 객체를 반환한다. 2. 제너레이터 함수의 정의 제너레이터 함수는 function* 키워드로 선언하며 하나 이상의 yield 표현식을 포함한다. 이것을 제외하면 일반 함수를 정의하는 방법과 같다. 제네레이터 함수는 화살표 함수로 정의할 수 없 // 제너레이터 함수 선언문 function* genDecFunc() {.. 2024. 1. 24.
[JS] 이터러블 34장 : 이터러블 1. 이터레이션 프로토콜 ES6에서 도입된 이터레이션 프로토콜은 순회 가능한(iterable) 데이터 컬렉션(자료구조)을 만들기 위해 ECMAScript 사양에 정의하여 미리 약속한 규칙이다. 이터레이션 프로토콜에는 이터러블 프로토콜과 이터레이터 프로토콜이 있다. 1. 이터러블 이터러블은 프로토콜을 준수한 객체를 이터러블이라 한다. 이터러블은 for...of 문으로 순회할 수 있으며 스프레드 문법과 배열 디스트럭처링 할당의 대상으로 사용할 수 있다. const isIterable = v => v !== null && typeof v[Symbol.iterator] === 'function'; // 배열, 문자열, Map, Set 등은 이터러블이다. isIterable([]); // ->.. 2024. 1. 23.
[JS] 프로미스 45장 : 프로미스 1. 비동기 처리를 위한 콜백 패턴의 단점 비동기 처리를 위한 콜백 패턴은 콜백 헬이나 에러 처리가 곤란하다는 문제가 있다. 이를 극복하기 위해 ES6에서 프로미스(Promise)가 도입되었다. 1. 콜백 헬 콜백 함수를 통해 비동기 처리 결과에 대한 후속 처리를 수행하는 비동기 함수가 비동기 처리 결과를 가지고 또다시 비동기 함수를 호출해야 한다면 콜백 함수 호출이 중첩되어 복잡도가 높아지는 현상이 발생하는데, 이를 콜백 헬이라 한다. 콜백 헬은 가독성을 나쁘게 하며 실수를 유발하는 원인이 된다. 아래는 콜백 헬이 발생하는 전형적인 사례다. get('/step1', a => { get(`/step2/${a}`, b => { get(`/step3/${b}`, c => { get(`/s.. 2024. 1. 22.
[JS] 비동기 프로그래밍 42장 : 비동기 프로그래밍 1. 동기 처리와 비동기 처리 동기 처리 : 실행 중인 태스트가 종료할 때까지 다음에 실행될 태스트가 대기하는 방식 비동기 처리 : 실행 중인 태스크가 종료되지 않은 상태라 해도 다음 태스크를 곧바로 실행하는 방식 function foo() { console.log('foo'); } function bar() { console.log('bar'); } // 타이머 함수 setTimeout이 bar 함수를 블로킹하지 않는다. setTimeout(foo, 3 * 1000); bar(); // bar 호출 -> (3초 경과 후) foo 호출 setTimeout, setInterval, HTTP 요청, 일부 메서드를 제외한 이벤트 핸들러는 비동기 처리 방식으로 동작한다. 2. 이벤트.. 2024. 1. 20.