Работает это по схеме, что мы постоянно определяем текущую позицию в массиве. То есть, если массив состоит из
["111", "222", "333", "444"], то очевидно, что последний добавленный цвет 444. Значит позиция будет вычисляться по формуле
Длина массива - 1. Дело в том, что длина массива начинается с 1, а по факту массив начинается с 0.
Когда мы передвигаем позицию мы отнимаем 1, если ушли назад и прибавляем 1, если ушли вперед, но уйти дальше, чем нужно в коде невозможно.
UPD. Я прочитал комменты, я крайне не рекомендую хранить это стадо цветов в кукисах или еще где-либо на памяти пользователя и вообще дальше обновления страницы. Вы засоряете человеку память, либо пишите функцию для очищения старых цветов, но я даже не знаю, как можно извратить эту задачу так, чтобы не пострадала память пользователя и работало хорошо.
let colors = [];
let spot;
function newColor(colors, color) {
colors.push(color);
}
function colorOld(colors, spot) {
if (spot !== 0) {
return colors[spot - 1];
}else {
// если пользователь попал под это условие, значит предыдущего цвета нет
return null;
}
}
function colorNext(colors, spot) {
if (spot < colors.length) {
return colors[spot + 1];
}else {
// если пользователь попал под это условии значит следующего цвета нет или это последний добавленный
return null;
}
}
// Не обращаем внимание на этот цикл. Он создан, чтобы сделать исскуственное добавление цветов. Если интересно, как он работает, отпиши в комментариях.
for (let i = 1; i < 5; i++) {
let str = i.toString();
newColor(colors, str.repeat(3));
}
spot = colors.length - 1; // Важно определить позицию после того, как цвет были добавлены новые цвета. Каждый раз переменную необходимо перезаписывать.
let oldColor = colorOld(colors, spot);
spot -= 1; // показываем что позиция сдвинулась назад
let nextColor = colorNext(colors, spot);
spot += 1; // показываем что позиция сдвинулась вперед
console.log(oldColor);
console.log(nextColor)
