https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Promise/all

Promise all()

Promise all() 메서드는 순회 가능한 객체에 주어진 모든 프로미스가 이행한 후, 혹은 프로미스가 주어지지 않았을 때 이행하는 Promist를 반환

주어진 프로미스 중 하나가 거부하거나, 첫 번째로 거절한 프로미스의 이유를 사용해 자신도 거부함.

Promise.all은 파라미터로 배열을 받는다. 따라서 모든 요소가 프로미스 객체이거나 프로미스 객체가 포함된 배열을 인자로 넣어준다.
Promise는 말 그대로 하나라도 거부되면 Promise.all 은 즉시 거부된다.

const promise1 = Promise.resolve(3);
const promise2 = 42;
const promise3 = new Promise((resolve, reject) => {
  setTimeout(resolve, 100, 'foo');
});

Promise.all([promise1, promise2, promise3]).then((values) => {
  console.log(values);
});
// expected output: Array [3, 42, "foo"]

Ex)

 const onClickPromiseAll = async () => {
    console.time("시작!!");
    const result = await Promise.all([  //배열로 만들기
      new Promise((resolve, reject) => {
        setTimeout(() => {
          resolve("https://dog1.jpg");
        }, 3000);
      }),

      new Promise((resolve, reject) => {
        setTimeout(() => {
          resolve("https://dog2.jpg");
        }, 2000);
      }),

      new Promise((resolve, reject) => {
        setTimeout(() => {
          resolve("https://dog3.jpg");
        }, 1000);
      }),
    ])
    console.timeEnd("시작!!");

    console.log(result);
  }

Promise는 시간이 걸리는 작업을 할 때 사용하는데 이미지를 여러개 올리고 싶을 때는 이미지가 하나하나씩 올라가는 어려움이 있을 수 있음.
첫번쨰 이미지는 3초가 걸리고 2번째 이미지는 2초 , 1번째 이미지는 1초가 걸린다고 한다면
총 6초를 기다려야하지만
PromiseAll 메서드를 사용하게 된다면 각각 await로 기다리고 시간을 기다릴 필요없이 최대시간인 3초만 기다리면 3개의 요청을 다 받을 수 있음.

Promise.all을 사용할 경우 Promise.all에만 await를 붙여주면서 Promise.all안에 있는 배열이 동시에 요청된다.