История изменений инпутов с помощью Map ES6

Сейчас мы с вами реализуем задачу на практическое применение коллекций Map. Пусть у нас на странице есть инпуты - сделаем так, чтобы каждый инпут хранил историю своих изменений. А также реализуем перемещение по этой истории с помощью стрелок.

Исходники кода

<input><br><br>
<input><br><br>
<input>

let inputs = document.querySelectorAll('input');

let map = new Map;

for (let input of inputs) {
	map.set(input, {values: [], index: -1});
	
	input.addEventListener('blur', function() {
		let {values, index} = map.get(this);
		values.push(this.value);
		map.set(this, {values, index: index + 1});
		
		this.value = '';
		
		console.log(map.get(this));
	});
	
	input.addEventListener('keydown', function(event) {
		//console.log(event.key);
		
		if (event.key == 'ArrowLeft') {
			let {values, index} = map.get(this);
			
			if (index > - 1) {
				this.value = values[index];
				map.set(this, {values, index: index - 1});
			}
			
			event.preventDefault();
		}
		
		if (event.key == 'ArrowRight') {
			let {values, index} = map.get(this);
			
			if (index < values.length - 1) {
				this.value = values[index + 1];
				map.set(this, {values, index: index + 1});
			}
			
			event.preventDefault();
		}
	});
}