Как получать элементы массива по очереди по кругу с задержкой?

Question

[FlapJalc]

Написал код который читает данные из массива, и выводит их по очереди с полутора секундной задержкой. Но после того как все данные считываются, мне нужно заново запускать этот цикл. Была идея поместить это всё в while (true), но это оказалось плохой идеей. Пытался гуглить, но меня постоянно кидало на статью по замыканиям. Тут и правда нужно использовать замыкания? Если да, то как

<p>Открыть <b class="slide-words">замок</b></p>

var keys = ['замок', 'машину', 'сейф'];

for (var i = 0; i < keys.length; i++) {
  slideTime(i)
}

function slideTime(j) {
  setTimeout(function() {
    var slideWords = document.querySelector('.slide-words');
    slideWords.textContent = keys[j];
  }, 1500 * j);
}

Answer 1

[0xD34F]

function interval(arr, delay, callback) {
  let index = -1;

  return setInterval(() => {
    index = (index + 1) % arr.length;
    callback(arr[index]);
  }, delay);
}


const intervalId = interval(keys, 1500, function(text) {
  this.innerText = text;
}.bind(document.querySelector('.slide-words')));

Comments

[FlapJalc]

Вау. Это как я понимаю возможности ES. Пока ещё не добрался до их изучения. Спасибо!

[0xD34F]

Под "ES" вы имеете в виду ES6/7/...? Нет, ничего особенного тут нет, замените let/const на var, стрелочные функции на обычные - всё будет работать точно так же.

[Владимир]

FlapJalc, В своем решении вы используете setTimeout, setInterval из той же оперы, ES тут не при чем.
https://learn.javascript.ru/settimeout-setinterval

[FlapJalc]

0xD34F, Да именно про ES6/7. Тогда это оказывается setInterval такое позволяет производить. Не вникал в него глубоко, так как до изучения методов работы с браузером ещё не добрался.

[FlapJalc]

Владимир, Спасибо!

Answer 2

[alex]

через рекурсию можно