array.filter дает неопределенное значение - PullRequest
0 голосов
/ 05 апреля 2019

У меня есть файл json с такой структурой:

{"year" : 1990, "fact": "Er waren oorspronkelijk maar drie seizoenen van de serie voorzien"}

На моем сайте есть эпизоды из фильма. У всех есть дата выхода. Если дата выпуска совпадает с конкретным годом в файле JSON, я хочу показать факт, относящийся к этому году. Я пытаюсь сделать это с помощью этого кода:

const showFact = async () => {
        const year = document.querySelector(`.date`).textContent.split(` `)[2];
        const response = await fetch(`./assets/data/nice-to-know.json`);
        const facts = response.json();
        const fact = facts.filter(fact => fact.year == year).fact;
        document.querySelector(`.fact`).textContent = fact;
      }

Если я console.log(fact), я вижу, что факт undefined

Ответы [ 4 ]

2 голосов
/ 05 апреля 2019

Array.prototype.filter все еще возвращает массив, который вы ищете Array.protoype.find вместо

const facts = [
  {"year" : 1990, "fact": "1990 fact"},
  {"year" : 1991, "fact": "1991 fact"},
  {"year" : 1992, "fact": "1992 fact"},
  {"year" : 1993, "fact": "1993 fact"}
]
const fact = facts.find(fact => fact.year === 1990).fact;
console.log(fact);
1 голос
/ 05 апреля 2019

Как я уже сказал в комментариях, ваша проблема с

const fact = facts.filter(fact => fact.year == year).fact;

Поскольку filter возвращает массив, который, конечно, не имеет свойства fact.

Предполагая, что filter возвращает непустой одноэлементный массив, вы, вероятно, имели в виду.

const fact = facts.filter(fact => fact.year == year)[0].fact;
0 голосов
/ 05 апреля 2019

Как указывает Федерико в комментариях, вы пытаетесь получить доступ к свойству в массиве. Когда вы фильтруете facts, он становится массивом, вам нужно отобразить его.

const showFact = async () => {
        const year = document.querySelector(`.date`).textContent.split(` `)[2];
        const response = await fetch(`./assets/data/nice-to-know.json`);
        const facts = response.json();
        const factList = facts.filter(fact => fact.year == year).map(fact => fact.fact);
        document.querySelector(`.fact`).textContent = factList.join("<br>");
      }

выше Я использовал функцию map для извлечения фактов в массив только фактов (без года), а затем объединился с переводом строки.

0 голосов
/ 05 апреля 2019
const showFact = async () => {
    const year = document.querySelector(`.date`).textContent.split(` `)[2];
    const response = await fetch(`./assets/data/nice-to-know.json`);
    const facts = await response.json();
    const fact = facts.filter(fact => fact.year == year)[0].fact;
    document.querySelector(`.fact`).textContent = fact;
  }

array.filter возвращает массив.Мне просто нужно было выбрать первый элемент этого массива.

...