Analýza střídání křížku a kolečka

V této lekci vám chci ukázat, jak provést střídání křížku a kolečka v jednom řádku. Nejspíše jste udělali něco takového:

function start(cells) {
	let i = 0; // počáteční hodnota čítače
	
	for (let cell of cells) {
		cell.addEventListener('click', function() {
			if (i % 2 == 0) {
				this.textContent = 'X';
			} else {
				this.textContent = '0';
			}
			
			i++; // zvýšíme čítač
		});
	}
}

Já navrhuji řešit úkol kratším způsobem. Vytvoříme pole našich hráčů:

let gamers = ['X', 'O'];

Jak vidíte, v tomto poli má křížek klíč 0 a kolečko - klíč 1. To samé lze říci o i % 2 - pro křížek bude zbytek 0 a pro kolečko - 1.

To znamená, že tuto věc lze použít místo klíče:

let gamers = ['X', 'O'];
let key = i % 2;

console.log(gamers[key]);

Nebo ještě kratší:

let gamers = ['X', 'O'];
console.log(gamers[i % 2]);

Nebo ještě kratší:

console.log(['X', 'O'][i % 2]);

Zjednodušme nyní kód naší funkce start:

function start(cells) {
	let i = 0;
	
	for (let cell of cells) {
		cell.addEventListener('click', function() {
			this.textContent = ['X', 'O'][i % 2];
			i++;
		});
	}
}

Samostatně, bez nahlížení do mého kódu, proveďte popsanou úpravu.

Nyní lze na libovolnou buňku provést neomezený počet kliknutí, čímž se mění, například, křížek na kolečko. Opravte to.