본문 바로가기

분류 전체보기57

[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.
[JS] ES6 함수의 추가 기능 26장 : ES6 함수의 추가 기능 1. 함수의 구분 ES6에서는 함수를 사용 목적에 따라 세 가지 종류로 구분한다. ES6 함수의 구분 constructor prototype super arguments 일반 함수 O O X O 메서드 X X O O 화살표 함수 X X X X 2. 메서드 ES6 사양에서 메서드는 메서드 축약 표현(function 키워드 생략)으로 정의된 함수만을 의미한다. const obj = { x:1, // foo : 메서드 foo() {return this.x}, // bar 에 바인딩된 함수는 메서드가 아닌 일반 함수 bar: function() {return this.x;} } new obj.foo(); // TypeError : obj.foo is not a cunstruc.. 2024. 1. 16.
[JS] 클로저 24장 : 클로저 MDN에서 정의된 클로저란? 클로저는 함수와 그 함수가 선언된 렉시컬 환경과의 조합이다. const x = 1; function outerFunc() { const x = 10; innerFunc(); } function innerFunc() { console.log(x); // 1 } outerFunc();​ innerFunc 함수를 outerFunc 함수의 내부에서 호출한다 하더라도 outerFunc 함수의 변수에 접근할 수 없다 자바스크립트는 렉시컬 스코프를 따르는 프로그래밍 언어이기 때문이다 1. 렉시컬 스코프(= 정적 스코프) 자바스크립트 엔진은 함수를 어디서 호출했는지가 아니라 함수를 어디서 정의했는지에 따라 상위 스코프를 결정한다. 함수를 어디서 호출하는지는 상위 스코프 결.. 2024. 1. 14.