Получение данных JSON, отфильтрованных по дате, и создание из них нового массива

Итак, у меня проблема с данными Javascript и JSON. Когда я получаю данные с определенного URL-адреса, я получаю данные в файле JSON со строками. Теперь моя проблема. Одна из этих строк - это дата, которую мне нужно использовать, чтобы, когда дата меньше текущей даты, из нее формировалась новая строка, чтобы я мог правильно отображать данные в HTML, который я разрабатываю. ?

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

Примечание. Дата указана в формате ISO_8601. Также я новичок в написании сценариев. Заранее спасибо.

Вы можете привести пример данных JSON?

Leonid Pyrlia 13.07.2018 15:42
Поведение ключевого слова "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
854
4
Перейти к ответу Данный вопрос помечен как решенный

Ответы 4

Если вы передадите эту строку в новую функцию Date (yourString), она вернет вам объект даты JavaScript.

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Date

Пример:

const newDate = new Date('2008-09-15T15:53:00')
// Will return a date object with the value of:
// Mon Sep 15 2008 15:53:00 GMT-0700 (Pacific Daylight Time)

const currentDate = Date.now();
// Will return a date object with the current date.

console.info(newDate < currentDate);
// Will compare the two dates.

Итак, если я прав: мне нужна такая дата> var eventTime = new Date (event.time), ЕСЛИ мой JSON выглядит как этот ''event'{ time: ''date in a string'' }'

DavidB 13.07.2018 15:47

случайно нажал несколько раз Enter @Simeon Smith, извините.

DavidB 13.07.2018 15:49

хорошо. Я расскажу о вас, как только попробую. Спасибо за помощь

DavidB 13.07.2018 15:49

Затем вы можете создать текущую дату с помощью Date.now () и сравнить их.

Simeon Smith 13.07.2018 15:50

Что ж, вы на самом деле не предоставляете достаточно информации о своей структуре JSON и о том, чего вы уже достигли, поэтому, пожалуйста, добавьте дополнительные сведения, если этого недостаточно, но я предполагаю, что что-то вроде этого:

var eventsFromMyJSONstring = JSON.parse(theJSONstringFetchedFromCertainURL);
 var currentDate = new Date();
 eventsFromMyJSONstring.forEach(function(iEvent) {
    iEvent.newVarAsDate = new Date(iEvent.textDate);
    if (iEvent.newVarAsDate >= currentDate) {
        alert('hey, this object is from today or future');
    }
});

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

var currentAndFutureEvents = eventsFromMyJSONstring.filter((iEvent) => new Date(iEvent.textDate) >= new Date());

(Предполагается, что ES6 там ...)

Я не знаю, как выглядят ваши данные, но в целом вам нужно выполнить два шага:

  • преобразовывать строки в фактические объекты Date
  • отфильтровать прошлые даты

Конвертировать довольно просто, просто new Date(<ISO 8601 string>):

new Date("2018-06-12"); // -> Tue Jun 12 2018 01:00:00 GMT+0100
new Date("2018-07-13"); // -> Fri Jul 13 2018 01:00:00 GMT+0100

Отфильтровать прошлые события можно с помощью Array.filter. Вы даете ему функцию, которая возвращает True или False, и она запускает ее для каждого элемента массива. Элементы, для которых функция вернула True, помещаются в новый массив:

[1, 3, 4, 6, 7].filter(number => number > 4); // -> [6, 7]
[1, 3, 4, 6, 7].filter(number => number <= 4); // -> [1, 3, 4]

Итак, чтобы отфильтровать прошлые даты / время, вы просто сравниваете их с сегодняшней датой. Единственная сложность заключается в том, что передача строки типа 2018-06-07 (только дата, без указания времени) в new Date(…) устанавливает время на текущее:

new Date("2018-06-07"); // -> Thu Jun 07 2018 01:00:00 GMT+0100

Если вам нужно сравнивать только по дням, а не часам или даже минутам, удобно установить время после полуночи:

(new Date("2018-06-07")).setHours(0) // -> Thu Jun 07 2018 00:00:00 GMT+0100

Итак, в совокупности:

const data = {
  events: [
    { name: "Event 1", date: "2018-06-12" },
    { name: "Event 2", date: "2018-07-10" },
    { name: "Event 3", date: "2018-07-12" },
    { name: "Event 4", date: "2018-07-13" },
    { name: "Event 5", date: "2018-08-01" }
  ]
}

const today = (new Date()).setHours(0) // past midnight

const todayAndFutureEvents = data.events.filter(event => (new Date(event.date)) >= today);

console.info(todayAndFutureEvents);

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

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

Как сказал Симеон, мое мнение такое же, я хотел бы добавить немного больше информации о нем.

Когда у вас есть свидания, вам нужно сделать две вещи:

  • Сначала проверяется, является ли это датой действительный
  • Его дата предстоящее / будущее или нет.

Вы не добавили пример дат JSON, о котором идет речь, я предполагаю, что у вас есть JSON, как показано ниже.

[
    {name: "Something", date: "12-12-2018"},
    {name: "Something", date: "12-12-2017"},
    {name: "Something", date: "12-12-2019"},
    {name: "Something", date: "12-5-2018"},
    {name: "Something", date: "12-2-2018"},
    {name: "Something", date: "SOMETHING_INVALID"},
    {name: "Something", date: "12-12-2016"},
]

Вы можете отфильтровать действительную дату и будущие даты с помощью фильтр следующим образом:

let dates = [
    {name: "Something", date: "1-12-2018"},
    {name: "Something", date: "2-12-2017"},
    {name: "Something", date: "3-12-2019"},
    {name: "Something", date: "4-5-2018"},
    {name: "Something", date: "5-2-2018"},
    {name: "Something", date: "InvalidSomething"},
    {name: "Something", date: "7-12-2016"},
]

let filteredDates = dates.filter((item) => {
    let date = new Date(item.date);
    if (date !== 'Invalid Date' && Date.now() < date.getTime()){
        return item;
    }
});


console.info(filteredDates);

Число Небольшое уточнение: Date.now() и date.getTime() оба используются для получения отметка времени, и я сравниваю внутри фильтра JavaScript, если объект даты не возвращает строку "Invalid Date" и если ** временная метка больше сегодняшнего отметка времени, чем его дата в будущем.

Когда эти два условия совпадают, filter вернет весь object, который собирается переменной filteredDates. когда цикл будет завершен, вы получите свой массив для дальнейшего использования. Ваше здоровье!

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