Kentavr16

ты пытаешься присвоитьevt.target = paginationButtons[k] а хочешь проверить. Для этого используй == или ===.

1) Под el подразумевается в данном случае аргумент, который будет передан функции. Название может быть произвольным - хоть arr,хоть el,хоть любое другое - на что хватит воображения автору.

Ведь получается, что под el подразумевается каждый элемент массива

- неверно. В данном случае функции передается массив arr, значит под el подразумевается массив arr.
2) можете заменить строчку кода на result.push(sumEl), ничего не поменяется.

КАЖДЫЙ индекс элемента массива result равен результату суммы элементов массива arr.

- не совсем верно. Это звучит как "на каждой итерации добавить значение в массив result по индексу, который равен индексу текущей итерации". Усложненный вариант, пуш вполне подходит.
3)Заходим на mdn и читаем -

Метод reduce() применяет функцию reducer к каждому элементу массива (слева-направо), возвращая одно результирующее значение.

То есть на каждой итерации редьюс возвращает результат действий над текущим элементом массива. То есть на второй итерации мы возвращаем 1+2(3), и именно благодаря этому наша функция reduce на следующей итерации в аргумент sum получает 3, прибавляет к нему следующий элемент - 3, и возвращает их сумму - 6. Третья итерация "ловит" 6 ,прибавляет текущий элемент 4 и передает дальше их сумму 10.
return result просто возвращает результат выполнения нашей функции , чтобы можно было использовать этот результат вне функции. В данном случае вернувшийся результат передается в console.log.

То что в темах - обязательная база JS. React это просто дополнительный инструмент в руках разработчика, это не другой язык, не другой принцип построения веб-сайтов. Обязательно все указанное учить. Все и с самого начала. Я сам пробовал "начинать учиться" с реакта. Глупость полная. Это как попытка начать залезать на лестницу сразу с 10-й ступеньки. Не выйдет.

const nextSlide = (arr) => {
    let ind = 0;
    arr.forEach((element, index) => {
        if (element.classList.contains("slider__item--active")) {
            ind = index + 1
        }
        element.classList.remove("slider__item--active")
    })
    if (ind >= arr.length) { ind = 0 }
    arr[ind].classList.add("slider__item--active")

}

document.addEventListener("click", (evt) => {
    const target = evt.target;
    const slider = target.parentNode
    if (target.classList.contains("slider__btn--next")) {
        nextSlide([...slider.querySelectorAll(".slider__item")])
    }
})

Код не работает потому что вы проводите манипуляции с arr,который в каждом клике определяется как новый - каждый раз в итоге вы перелистываете с 1 на второй элемент.

В общем, спасибо ув. Lynn «Кофеман», который надоумил

Нет. Но никто не мешает передавать res в функцию как аргумент.

Дата сместилась из-за slice

https://codepen.io/kentavr16/pen/OJOvPKw