1. 클래스

자바스크립트에서 클래스는 ES6에서 추가된 개념으로 기존 Java나 C++의 클래스를 대체한다.

자바스크립트의 클래스는 프로토타입을 이용해 만들어졌다. 다음 문서들을 참고하여 클래스를 나름대로 정리해보자.

PoiemaWeb

Classes - JavaScript | MDN

클래스

<aside> 💡 항상 남들에게 설명할 수 있을 정도로 정리하는 것이 제일 중요!

</aside>

2. 프로미스

프로미스는 자바스크립트 비동기 처리 문제점 해결에 사용되는 객체다.

자바스크립트의 비동기 처리란 ‘특정 코드의 실행이 완료될 때까지 기다리지 않고 다음 코드를 먼저 수행하는 자바스크립트의 특성’을 말한다.

이러한 프로미스는 주로 서버에서 데이터를 받아와 화면에 표시할 때 사용한다.

프로미스의 개념에 대해 정리하고, 사용법과 사용하는 이유에 대해 정리할것

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

3. async / await

async와 await은 프로미스를 좀 더 편리하게 사용하기 위한 문법이다.

사용법에 대해 정리해보고 다음 코드를 async와 await를 쓰는 형태로 바꿔볼 것

<aside> 💡 GPT를 사용하지 않고 바꿔보는 것을 권장합니다! 여유가 난다면 에러처리도 한번 해보길 바랍니다!

</aside>

const f1 = () => {
	return new Promise((res, rej) => {
		setTimeout(() => {
			res("1번 함수 호출 완료");
		}, 1000);
	});
};

const f2 = (message) => {
	console.log(message)
	return new Promise((res, rej) => {
		setTimeout(() => {
			rej("2번 함수 호출 완료");
		}, 2000);
	});
};

const f3 = (message) => {
	console.log(message)
	return new Promise((res, rej) => {
		setTimeout(() => {
			res("3번 함수 호출 완료");
		}, 3000);
	});
};

f1()
	.then(res => f2(res))
	.then(res => f3(res))
	.then(res => console.log(res))
	.catch(console.log);

Quiz

01 - Callback Hell 🔥