Promise all

Promise & Promise.all()

// Promise
// Promise에서 resolve가 실행이 되면 종료, reject가 실행되면 오류

	const onClickPromise = async () => {
		const result1 = await new Promise((resolve, reject) => {
			setTimeout((resolve("3초 후 실행됩니다.")) => {}, 3000)
		})
		const result2 = await new Promise((resolve, reject) => {
			setTimeout((resolve("2초 후 실행됩니다.")) => {}, 2000)			
		})
		const result3 = await new Promise((resolve, reject) => {
			setTimeout((resolve("1초 후 실행됩니다.")) => {}, 1000)
		})
	};


// Promise.all()

	const onClickPromiseAll = async () => {
		const result = await Promise.all([
			setTimeout((resolve("3초 후 실행됩니다.")) => {}, 3000)
			setTimeout((resolve("2초 후 실행됩니다.")) => {}, 2000)
			setTimeout((resolve("1초 후 실행됩니다.")) => {}, 1000)
		])
	};

Promise

위의 함수는 result1 이 실행되고 난 후에 result2가 실행이 되고, result2가 실행된 후에, result3이 실행됩니다. 따라서 onClickPromise 함수의 경우 약 6초의 시간이 소요됩니다.

Promise.all()

Promise.all() 의 경우에는 Promise.all()에 포함되어 있는 함수들을 동시에 실행을 합니다. 따라서 onClickPromiseAll 함수의 경우 약 3초의 시간이 소요됩니다.

Promise.all() - map

Promise.all()을 사용하여 한번에 여러 함수를 실행할 때에는 map, for, forEach를 사용할 수 있습니다.

---

promise 생성자 함수를 new 연산자와 함께 호출하면 프로미스(promise 객체)를 생성합니다.
ES6에서 도입된 promise는 호스트객체가 아닌 ECMAScript 사양에 정의된 표준 빌트인 객체라고 합니다!
promise 생성자 함수는 비동기 처리를 수행할 콜백함수를 인수로 전달 받는데 이 콜백 함수는 resolve와 reject 함수응 인수로 전달 받습니다

• resolve : 성공했을때
• reject: 실패했을때
  try / catch 와 비슷합니다. promise.all 메서드는 프로미스를 요소로 갖는 배열 등의 이터러블을 인수로 전달받는다.
  그리고 전달받은 모든 프로미스가 모두 fulfilled 상태가 되면 모든 처리 결과를 배열에 저장해 새로운 프로미스를 반환한다.
  하지만 이 배열중 하나라도 reject 즉 ,실패가 되면 나머지를 기다리지않고 즉시 종료가 됩니다.
  또한 promise.all 메서드는 인수로 전달받은 이터러블의 요소가 프로미스가 아닌경우 promise.resolve 메서드를 통해 프로미스로 래핑한다.

Promise.all([
	1,
  	2,
  	3,
])
.then(console.log) // [1,2,3]
.catch(console.log);