Объект карты Javascript, пропускает элемент и устанавливает тайм-аут

это мой объект

[0 … 200]
0: {id: 2291798516830927, url: '.....', address: 'new', symbol: '1t43', fav: false}
1: {id: 7337710716729779, url: '.....', address: 'new', symbol: 'gf23525', fav: false}
2: {id: 6962996031953837, url: '.....', address: 'old', symbol: '435234', fav: false}
3: {id: 8456218226475281, url: '.....', address: 'old', symbol: '2345', fav: false}
4: {id: 6759748921116029, url: '.....', address: 'new', symbol: '$B2345ROKE', fav: false}
...


address="new"
bookmarks.map(function (bookmark, index) {
    setTimeout(() => {
        if (bookmark.address == address) {
           console.log(bookmark.symbol)
        }
    }, 1000 * index)
})

Что я хочу сделать, так это пропустить все «старые» адреса в моем объекте и продолжить сопоставление. По возможности между каждым циклом должен быть 2-секундный тайм-аут.

если я использую Timeout со значением "1000 * index" после первых двух объектов, то мне приходится ждать несколько минут до возобновления цикла, мне непонятно почему.

если я использую таймаут без с "1000" без "index" таймаут не работает, объект печатается полностью без таймаута

Что вы подразумеваете под "непонятно почему". Если вы установите тайм-аут в 199 секунд (потому что это то, что вы делаете для 200-го элемента), этот тайм-аут будет выполняться через 199 секунд (т.е. 3 минуты и 20 секунд).

derpirscher 09.04.2022 15:45

@derpirscher Я неправильно объяснил, через 3 м и 20 секунд N элементов печатаются одновременно, без дальнейшего ожидания и так далее. Цикл снова не работает нормально. В любом случае проблема решена, спасибо

exper_1 09.04.2022 16:06
Формы c голосовым вводом в React с помощью Speechly
Формы c голосовым вводом в React с помощью Speechly
Пытались ли вы когда-нибудь заполнить веб-форму в области электронной коммерции, которая требует много кликов и выбора? Вас попросят заполнить дату,...
В чем разница между Promise и Observable?
В чем разница между Promise и Observable?
Разберитесь в этом вопросе, и вы значительно повысите уровень своей компетенции.
Сравнение структур данных: Массивы и объекты в Javascript
Сравнение структур данных: Массивы и объекты в Javascript
Итак, вы изучили основы JavaScript и хотите перейти к изучению структур данных. Мотивация для изучения/понимания Структур данных может быть разной,...
Создание собственной системы электронной коммерции на базе Keystone.js - настройка среды и базовые модели
Создание собственной системы электронной коммерции на базе Keystone.js - настройка среды и базовые модели
Прошлая статья была первой из цикла статей о создании системы электронной коммерции с использованием Keystone.js, и она была посвящена главным образом...
Приложение для отслеживания бюджета на React js для начинающих
Приложение для отслеживания бюджета на React js для начинающих
Обучение на практике - это проверенная тема для достижения успеха в любой области. Если вы знаете контекст фразы "Практика делает человека...
Стоит ли использовать React в 2022 году?
Стоит ли использовать React в 2022 году?
В 2022 году мы все слышим о трендах фронтенда (React, Vue), но мы не знаем, почему мы должны использовать эти фреймворки, когда их использовать, а...
0
2
29
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

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

Я бы фильтровал и не использовал карту. Никогда не используйте карту, если вы имеете в виду forEach и не нуждаетесь в создании карты массива.

Мы можем использовать setTimeout или setInterval и очистить интервал, когда cnt === list.length

const bookmarks = [ {id: 2291798516830927, url: '.....', address: 'new', symbol: '1t43', fav: false},
 {id: 7337710716729779, url: '.....', address: 'new', symbol: 'gf23525', fav: false},
 {id: 6962996031953837, url: '.....', address: 'old', symbol: '435234', fav: false},
 {id: 8456218226475281, url: '.....', address: 'old', symbol: '2345', fav: false},
 {id: 6759748921116029, url: '.....', address: 'new', symbol: '$B2345ROKE', fav: false}
];


const addr="new";
const list = bookmarks.filter(({address}) => address === addr);
let cnt = 0;
const show = () => {
  if (cnt >= list.length) return; // stop the listing
  console.log(list[cnt].symbol);
  cnt++;
  setTimeout(show,2000); // next one
};
show()

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