코딩배우는고양이

등장배경 콜백 함수가 중첩될 수록 코드가 복잡해진다는 콜백 지옥을 해결하기 위해 Promise가 등장하였는데 Promise 또한 체인이 반복되면 프로미스 지옥이 펼쳐진다. Promise Hell 예시 fetch("URL") .then((response) => { if (response.ok) { return response.json(); } else { throw new Error("Error"); } }) .then((users) => { return users.map((user) => user.login); }) .then((logins) => { return logins.join(", "); }) .then((result) => { console.log(result); }) .catch((error..

Promise 등장 배경 자바스크립트에서 비동기 처리를 위해서 전통적으로 콜백 함수를 사용하였다. 함수 내부에서 함수 호출을 통해 비동기 작업의 결과를 받아서 인자로 주면 이를 이용해 후속 처리 작업을 수행하는 것이다. 콜백 함수는 중첩될 수록 가독성이 떨어지고 코드의 흐름을 파악하기 어려워진다는 문제가 있는데 특히 여러 개의 비동기 작업을 수행해야 할 때는 이른바 콜백 지옥(callback hell) 현상이 발생하게 된다. function increaseAndPrint(n, callback) { setTimeout(() => { const increased = n + 1; console.log(increased); if (callback) { callback(increased); // 콜백함수 호출 }..

동기와 비동기 의미 동기는 하나의 요청이 오면 완료가 되어야 다음 요청을 실행하는 순차적 방식으로 흐름을 쉽게 예측할 수 있고 비동기는 어떤 요청이 완료되기 전에 다음 요청을 실행하는 동시적 방식으로 여러 작업을 동시에 효율적으로 처리할 수 있다. 콜백 함수 콜백 함수의 사용 목적 비동기 방식으로 작성된 함수를 동기 처리하기 위해 주로 사용된다. 비동기 처리를 기본으로 하면서 일부 순차적인 처리를 해야될 때가 있기 때문이다. 콜백 함수 형태 function main(param1, param2, callbackFunc) { // ... 처리 내용 callbackFunc(); } main(1, 2, func()); 보통 함수를 선언한 뒤 함수 타입 파라미터를 맨 마지막에 하나 더 선언해주는 방식으로 정의한다..

개요 function Car() { this.tire = 4; this.handle = 1; } let kona = new Car(); let spark = new Car(); console.log(kona.tire); // 4 console.log(spark.tire); // 4 kona와 spark 인스턴스를 생성하게 되면 Car가 가지고 있는 tire와 handle이라는 변수가 각각 메모리에 할당이 된다. 객체를 만들 때마다 새로운 메모리 공간을 사용하게 되는데 이러한 문제를 프로토타입으로 해결할 수 있다. function Car() { } Car.prototype.tire = 4; Car.prototype.handle = 1; let kona = new Car(); let spark = new C..

1. 개념 함수와 그 함수가 접근할 수 있는 변수의 조합 변수의 스코프가 선언된 위치에 따라 정해지는 것과 달리 클로저는 선언된 함수 주변 환경에 따라 접근할 수 있는 변수가 달라진다. 이러한 환경은 어휘적 환경(Lexical Environment) 라고 한다. 2. 역할 2-1. 데이터를 보존하는 함수 function closure (meow) { let parameter; return `${parameter}${meow}`; } console.log(parameter); // ReferenceError: parameter is not defined (함수 내부에 선언한 변수에 접근 불가) console.log(meow); // ReferenceError: meow is not defined (매개변수..