Promise.all은 왜 쓰는 걸까?

백아름·2023년 5월 17일
0

프론트엔드

목록 보기
17/80

---- 구체적인 파일 경로를 지정해줌.

const user1Path = path.join();
const user2Path = path.join();

chaining하고 계속하는 건 직관적으로 와닿지 않음.
묶어서 처리하는 게 더 직관적임.

const readAllUsersChaining = () => {
	return getDataFromFilePromise(user1Path).then((user1) => {
    	return getDataFromFilePromise(user2path).then(user2) => {
        	return getDataFromFilePromise(user3path).then(user3) => {
            	return getDataFromFIletPromise(user4path).then(user4) => {
                	return [user1., user2, user3, user4].map(JSON.parse);
                });
            })                               
	.catch(err) => console.log(err));
        };

이런식을오 chaining하면 코드가 복잡해짐..
그런데 Promise.all은 코드가 간결해짐. 그리고 배열로 묶어서결과값을 return해줌. 여기서는 배열에 데이터를 추가하기만 하면됨.

return Promise.all([getDataFromFilePromise

근데 또 위에서 아래로 사람들이 코드를 읽기 때문에 더 직관적으로 읽기 위한 게 async, await임

그래서 아래꺼가 직관적임. 근데 아래 코드는 에러가 남.

const readAllUsersAsyncAwait = async () => {
//json을 읽어온 결과를 특정 변수에 담고 싶어. 그리고 그 변수들을 배열에 넣어서 리턴할래! 하려면
const user1= getDataFromFilePromise(user1Path);
const user2= getDataFromFilePromise(user2Path);
return [user1, user2].map(JSON.parse);
};

그래서 직관적으로 이해할 수 있는 코드 형식은 유지하되, 앞에 async를 명시하고 await을 추가하면 동기적으로 작동하ㅇ는 코드라는 것을 알 수 있음. await을 달아줌으로써 결과값이 fulfill되고 나서야 user2가 실행이 됨. user1 알아서 실행 다 해놓고! user2가 실행됨.

const readAllUsersAsyncAwait = async () => {
//json을 읽어온 결과를 특정 변수에 담고 싶어. 그리고 그 변수들을 배열에 넣어서 리턴할래! 하려면
const user1= await getDataFromFilePromise(user1Path);
const user2= await getDataFromFilePromise(user2Path);
return [user1, user2].map(JSON.parse);
};

여러가지 작업을 하는 경우에는 Promise.all 사용하는 게 나을 수 있음.
한가지 작업을 하는 경우에는 더 직관적으로 async await이 더 나을 수 있음.

profile
곧 훌륭해질 거에요!

0개의 댓글