맵 내에서 비동기 함수를 사용할 때 Promise.all이 정의되지 않은 값 배열로 확인되는 이유는 무엇입니까?-JS 튜토리얼-php.cn

맵 내에서 비동기 함수를 사용할 때 Promise.all이 정의되지 않은 값 배열로 확인되는 이유는 무엇입니까?

DDD

풀어 주다： 2024-11-02 09:27:02

원래의

697명이 탐색했습니다.

Why is Promise.all resolving with an array of undefined values when using async functions within a map?

Promise.all 정의되지 않은 배열 해결: 미스터리 공개

Promise는 비동기 프로그래밍 모델을 제공하여 향상된 코드 가독성과 흐름 제어를 가능하게 합니다. 그러나 때로는 예상치 못한 문제가 발생하기도 합니다. 이 질문은 Promise.all이 정의되지 않은 배열을 반환하고 조기에 해결되는 이유를 탐구합니다.

문제의 코드는 일반적인 약속 연결 패턴을 따릅니다.

<code class="javascript">const getQueries = (models, dbId, dateStart, dateEnd) => {
  return new Promise((resolve, reject) => {
    // Fetch database and perform operations
    .then(extractQueries, reject)
      .then(sortQueries, reject)
      .then(onlyTen, reject)
      .then(addText, reject)
      .then((queries) => {
        console.log("getQueries finished", queries);
        resolve(queries);
      }, reject);
  });
};</code>

로그인 후 복사

초기 코드를 성공적으로 완료한 후 작업 중에 문제는 addText 함수 내에서 발생합니다.

<code class="javascript">const addText = (queries) => {
  return Promise.all(queries.map((query) => {
    // Oops! We're missing a `return` here!
    models.queries.findById(query.queryId, {
      raw: true,
      attributes: ["query"],
    })
      .then((queryFetched) => {
        query.text = queryFetched.query;
        console.log(query);

        return Promise.resolve(query);
      }, (error) => {
        return Promise.reject(error);
      });
  }));
};</code>

로그인 후 복사

문제의 근본 원인은 지도 콜백 함수에 반환 문이 누락되어 있기 때문입니다. Promise.all은 Promise 객체의 배열을 기대하지만 반환이 없으면 콜백은 쿼리 배열의 각 요소에 대해 정의되지 않은 값을 반환합니다.

결과적으로 Promise.all은 이전에도 정의되지 않은 배열로 즉시 해결됩니다. 맵 내부의 실제 Promise에는 해결 기회가 있습니다. 이러한 성급한 해결은 예상치 못한 동작과 정의되지 않은 값의 배열로 이어집니다.

문제를 해결하려면 addText 함수의 각 Promise 호출 앞에 return 문을 추가하는 것이 중요합니다.

<code class="javascript">const addText = (queries) => {
  return Promise.all(queries.map((query) => {
    return models.queries.findById(query.queryId, {
      raw: true,
      attributes: ["query"],
    })
      .then((queryFetched) => {
        query.text = queryFetched.query;
        console.log(query);

        return Promise.resolve(query);
      }, (error) => {
        return Promise.reject(error);
      });
  }));
};</code>

로그인 후 복사

이제 Promise.all은 배열의 모든 Promise가 해결될 때까지 올바르게 대기하여 쿼리 결과가 포함된 예상 출력을 생성합니다.

위 내용은 맵 내에서 비동기 함수를 사용할 때 Promise.all이 정의되지 않은 값 배열로 확인되는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!