Slider de texto com setas em JavaScript

Agora vamos fazer um slider de texto com setas. Isso significa que o texto mudará não por um temporizador, mas ao clicar em uma seta. Vamos adicionar setas ao nosso código HTML:

<a href="" id="left">←</a>
<a href="" id="right">→</a>
<div id="slider"></div>

A principal sutileza da solução deste slider é que a variável contadora de textos deve ser comum para os manipuladores de clique de nossas setas:

let i = 0; // variável externa

left.addEventListener('click', function() {
	// diminui i em 1
	// e exibe o texto com o número i
});
right.addEventListener('click', function() {
	// aumenta i em 1
	// e exibe o texto com o número i
});

E a segunda sutileza é que, tanto ao diminuir i, quanto ao aumentar, não se pode sair para números menores que zero e maiores que o último elemento do array.

Implemente o slider descrito. Faça com que os textos circulem.

Modifique a tarefa anterior para que os textos não circulem, mas simplesmente não avancem além ao atingir a posição mais à direita ou à esquerda.