Ошибка сопоставления через массив объектов - javascript

Я пытаюсь сопоставить массив объектов, возвращаемых сторонним API, чтобы вернуть определенные значения объектов, но в моей функции карты есть ошибка, и я не могу понять, почему. Я протестировал, чтобы убедиться, что остальная часть моего кода ведет себя должным образом, это всего лишь одна функция карты, с которой я не могу работать.

Это мой текущий код:

async function displayRecipeCard(inputString) {
 
 const recipes = await getRecipeInfo(inputString); //fetches data from api and returns an object
 const recipeResults = recipes.results; // returns an array of objects

 const recipeCard = recipeResults.map(recipe => {
   return recipe.title; 
 });
};

Возвращение:

[[PromiseStatus]]: "resolved"
[[PromiseValue]]: undefined

Теперь, если я напишу:

async function displayRecipeCard(inputString) {
  const recipes = await getRecipeInfo(inputString);
  const recipeResults = await recipes.results;
  
  return recipeResults[0].title;
};

Он возвращает заголовок первого элемента объекта массива, как и ожидалось:

[[PromiseStatus]]: "resolved"
[[PromiseValue]]: undefined

Может ли кто-нибудь заметить какие-либо ошибки в моем коде или понять, в чем проблема?

Спасибо!


javascript arrays object array.prototype.map
person sb95 gat    schedule 04.07.2020    source источник
comment
Вы говорите, что значения recipeCard - это обещание, которое разрешается как undefined? Или вы говорите, что вызов displayRecipeCard() дает обещание, которое принимает значение undefined? Если это displayRecipeCard(), это потому, что вы ничего не возвращаете из функции displayRecipeCard   -  person Nick Parsons    schedule 04.07.2020

Ответы (1)


arrow_upward
0
arrow_downward

Судя по тому, что вы говорите, может показаться, что results - это обещание. Итак, вам нужно дождаться этого обещания, а затем map массив, который он выполняет:

async function displayRecipeCard(inputString) {
    const recipes = await getRecipeInfo(inputString);
    //              ^^^^^−−−−− you'll want to double-check that this is necessary
    const recipeResults = await recipes.results;
    //                    ^^^^^−−−−− looks like you need this one though
   
    const recipeCard = recipeResults.map(({title}) => title); // Your original was fine, but this shows using destructuring if you like
} // Note: No `;` on function declarations

По сути, вам необходимо проверить документацию (или реализацию) getReceiptInfo, чтобы убедиться, что он возвращает, а затем await любые обещания, прежде чем выполнять map.

person T.J. Crowder    schedule 04.07.2020
comment
(Угу! Ошибка редактирования. Если вы видите, что хотите дважды проверить, что это необходимо, нажмите "Обновить".) - person T.J. Crowder; 04.07.2020