Как прочитать первый элемент массива, если массив является свойством объекта?

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

[
    {
        "id": 5440,
        "name": "Kirby Triple Deluxe",
        "release_dates": [
            {
                "id": 16596,
                "human": "Jan 11, 2014"
            },
            {
                "id": 16598,
                "human": "May 16, 2014"
            },
            {
                "id": 250078,
                "human": "May 01, 2014"
            }
        ]
    }
]

Вот код, который я использовал для регистрации всего массива release_dates:

const collections = response.data;
collections.forEach(collection => {
  console.info(collection.name);
  console.info(collection.release_dates);
});

Как я могу прочитать только первый элемент в массиве? Я хочу просмотреть «человеческое» свойство первого элемента. Одна вещь, которую я пробовал, была collection.release_dates[0].human, но это не сработало.

Обновлено: Чтобы дать немного больше ясности: ошибка, которую я получаю, когда пытаюсь console.info(collection.release_dates[0].human); в цикле forEach, такова: TypeError: Cannot read properties of undefined (reading '0')

Почему не работает collection.release_dates[0].human. Это выдало ошибку?

user4546364 05.04.2023 08:08

Убедитесь, что вы используете collection.release_dates[0].human внутри цикла forEach. Это должно работать, и вывод должен быть Jan 11, 2014

anand 05.04.2023 08:10

Прежде чем мы получим больше ответов с collection[0], не могли бы вы подтвердить точную структуру данных response.data. Это фрагмент JSON в вашем вопросе или он представляет что-то еще? Используйте console.info("response.data:", JSON.stringify(response.data, null, 2)) и отредактируйте свой вопрос с результатом

Phil 05.04.2023 08:11

collections.forEach(коллекция =>{ console.info(коллекция['release_dates'][0]['human']) } )

Sarthak Gupta 05.04.2023 08:12

@SarthakGupta Я не понимаю, как это вообще изменит ситуацию

Phil 05.04.2023 08:13

когда foreach, возможно, есть элементы с датами выпуска, имеет 0 элементов, поэтому [0].человеческие ошибки? в этом случае используйте необязательную цепочку ?.[0]?.human

cmgchess 05.04.2023 08:14

Я получаю эту ошибку, когда пытаюсь использовать этот код в forEach: TypeError: Cannot read properties of undefined (reading '0')

Sami 05.04.2023 08:17

Похоже, @cmgchess понял это правильно. У вас есть записи без свойства release_dates. Некоторая простая отладка прошла бы долгий путь

Phil 05.04.2023 08:18

@ Сами, вы должны сначала проверить, имеет ли длина массива release_dates > 0, с помощью if (collection.release_dates.length).

Jordy 05.04.2023 08:21

@Jordy, который будет страдать от той же проблемы (прочитайте сообщение об ошибке еще раз)

Phil 05.04.2023 08:21

@ Джорди Да, это помогло. У некоторых результатов нет даты выпуска, что, по-видимому, и является причиной сбоя. Я ограничил поиск только одним результатом, который, как я знал, имел дату выпуска и работал. Вопрос в том, как я могу заставить свой код игнорировать дату выпуска, если в списке нет дат выпуска? Я уже что-то пробовал, но это не сработало

Sami 05.04.2023 08:25
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Безумие обратных вызовов в javascript [JS]
Безумие обратных вызовов в javascript [JS]
Здравствуйте! Юный падаван 🚀. Присоединяйся ко мне, чтобы разобраться в одной из самых запутанных концепций, когда вы начинаете изучать мир...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
JavaScript Вопросы с множественным выбором и ответы
JavaScript Вопросы с множественным выбором и ответы
Если вы ищете платформу, которая предоставляет вам бесплатный тест JavaScript MCQ (Multiple Choice Questions With Answers) для оценки ваших знаний,...
3
11
77
4
Перейти к ответу Данный вопрос помечен как решенный

Ответы 4

Интересно, почему это не сработало, по словам спрашивающего.

let collections = [
    {
        "id": 5440,
        "name": "Kirby Triple Deluxe",
        "release_dates": [
            {
                "id": 16596,
                "human": "Jan 11, 2014"
            },
            {
                "id": 16598,
                "human": "May 16, 2014"
            },
            {
                "id": 250078,
                "human": "May 01, 2014"
            }
        ]
    },
    {
        "id": 5441,
        "name": "Kirby Triple Deluxe 2",
        "release_dates": []
    }
];
collections.forEach(collection => {
  if (collection.release_dates.length) {
    console.info(collection.release_dates[0].human);
  }
});

ОП уже сказал, что это не сработало

Phil 05.04.2023 08:13

Вероятно, ответ, которым поделился ОП, неполный. Если бы это было так, то этот код работал бы.

anand 05.04.2023 08:17

Я не создавал объект коллекций вручную. Это список, который я получаю от API IGDB всякий раз, когда пользователь выполняет поиск. Я включу полный код в OP, чтобы добавить больше ясности.

Sami 05.04.2023 08:20

Пожалуйста, поделитесь полными данными для поиска ошибок

Jordy 05.04.2023 08:22

Похоже, ваш объект является частью самого массива верхнего уровня...

Я думаю, вы назвали этот массив «коллекцией», не так ли?

если этот массив (который содержит ваш объект) упоминается в разделе «коллекция», вы должны иметь доступ к нему с помощью

collection[0]["release_dates"][0]

Дайте мне знать, если это сработало

это не сработало

Sami 05.04.2023 08:14

В некоторых случаях, если ключ release_dates отсутствует в объекте, он выдает ошибку undefined. Таким образом, вы должны использовать необязательную цепочку.

collection.release_dates?.[0]?.human
Ответ принят как подходящий

Следуя другим ответам, вот тот, где вы также можете положиться на запасной вариант.

collections.forEach(collection => {
  const releaseDate = collection?.release_dates?.[0]?.human ?? 'No release date.'
});

?? называется нулевым оператором объединения. Даже если release_dates[0] может быть undefined, вы можете надежно отказаться от «Нет даты выпуска». нить.

Другие вопросы по теме