cringeg

Работает это по схеме, что мы постоянно определяем текущую позицию в массиве. То есть, если массив состоит из ["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)