Analýza striedania krížika a koliečka

V tejto lekcii vám chcem ukázať, ako urobiť striedanie krížika a koliečka v jednom riadku. Vy ste pravdepodobne urobili niečo takéto:

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

Navrhujem vyriešiť úlohu kratšie. Urobme pole našich 'hráčov':

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

Ako vidíte, v tomto poli má krížik kľúč 0 a koliečko - kľúč 1. To isté možno povedať aj o i % 2 - pre krížik bude zvyšok 0, a pre koliečko - 1.

To znamená, že túto vec možno použiť namiesto kľúča:

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

console.log(gamers[key]);

Alebo ešte kratšie:

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

Alebo ešte kratšie:

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

Zjednodušme teraz kód našej funkcie start:

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

Samostatne, bez nahliadania do môjho kódu, vnášte opísanú opravu.

Momentálne je možné na ľubovoľné políčko robiť neobmedzené množstvo kliknutí, meniac napríklad krížik na koliečko. Opravte to.