Как я могу получить определенный массив из данных JSON и отобразить его?

Во-первых, приношу извинения, так как я новичок в получении данных из API и пытаюсь учиться.

Мне нужно получить «имя», «возраст» и «телефон» из «id» 1 из «is» и отобразить его при нажатии на кнопку. Это мой файл javascript-fetch-api.js:

Я не уверен, как получить только из id 1 "is"

const events = [{
  "id": 1,
  "language": {
    "is": {
      "name": "Ali Sakaroğlu",
      "age": 27,
      "phone": "05368218685",
      "tags": [
        "Gallery",
        "STAK",
        "Gallery Julius",
        "mom",
        "young",
        "lorem",
        "ipsum",
        "show",
        "born",
        "worm",
        "dorm",
        "norm",
        "dlla"
      ]
    },
    "en": {
      "name": "Ali Sakaroğlus",
      "age": 27,
      "phone": "05368218685",
      "tags": [
        "Gallery",
        "STAK",
        "Gallery Julius",
        "mom",
        "young",
        "lorem",
        "ipsum",
        "show",
        "born",
        "worm",
        "dorm",
        "norm",
        "dlla"
      ]
    }
  }
}]


let output = '<ul>';
events.forEach((event) => {
  output += `<li>${event.id})  Name: ${event.name} - Age: ${event.age} - Phone: ${event.phone} </li> `;
});

output += '</ul> <hr>';
document.getElementById('output').innerHTML += output;
<div id = "output"></div>

Я сделал вам минимальный воспроизводимый пример так как выборка явно сработала

mplungjan 19.11.2022 22:46
Поведение ключевого слова "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) для оценки ваших знаний,...
0
1
82
3
Перейти к ответу Данный вопрос помечен как решенный

Ответы 3

Ответ принят как подходящий

внутри события у вас есть идентификатор и язык, а не имя, возраст и телефон. если вы хотите получить имя, возраст и телефон от «есть», вы должны ввести:

 event.language.is.age
 event.language.is.name
 event.language.is.phone

Спасибо за ответ. Я попытался изменить его, но теперь я получаю это сообщение об ошибке в консоли; Отклонение необработанного обещания: SyntaxError: Строка не соответствует ожидаемому шаблону. promiseEmptyOnRejected

reidar ja 19.11.2022 22:58

Я проверил, и это работает. посмотреть можно здесь stackblitz.com/edit/web-platform-341tym?file=script.js

Georgemff 19.11.2022 23:07

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

damonholden 19.11.2022 23:09

Если вы нажмете редактировать, а затем [<>], вы можете опубликовать актуальное решение здесь, а не на странице, которая может исчезнуть.

mplungjan 20.11.2022 08:33

@mplungjan вопрос был «как получить имя, возраст и телефон от« есть »», и я опубликовал ответ на этот вопрос. У автора была другая ошибка, и он не имеет никакого отношения к этому вопросу.

Georgemff 20.11.2022 12:52

Вы ВСЕ ЕЩЕ можете опубликовать код ответа здесь, чтобы другие могли его увидеть.

mplungjan 20.11.2022 14:35

Вы можете развернуть объект следующим образом, чтобы получить name и т. д. из свойства is:

      output += `<li>${event.id})  Name: ${event.is.name} - Age: ${event.is.age} - Phone: ${event.is.phone} </li> `;

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

live code: https://jsfiddle.net/cu2q9dzm/

function getJson() {
  fetch('https://raw.githubusercontent.com/FEND16/movie-json-data/master/json/movies-in-theaters.json').then((response) => response.json())
    .then((data) => data.forEach(data => {
      console.info("id: ", data.id, "year: ", data.year, "title: ", data.title);
    }));
}
getJson();

Если вы нажмете редактировать, а затем [<>], вы можете разместить код здесь

mplungjan 20.11.2022 08:30

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