Ontleding van die afwisseling van kruis en nul

In hierdie les wil ek vir jou wys hoe om die afwisseling van kruis en nul in een reël te maak. Jy het heel waarskynlik iets soos dit gedoen:

function start(cells) {
	let i = 0; // beginwaarde van die teller
	
	for (let cell of cells) {
		cell.addEventListener('click', function() {
			if (i % 2 == 0) {
				this.textContent = 'X';
			} else {
				this.textContent = '0';
			}
			
			i++; // verhoog die teller
		});
	}
}

Ek sal voorstel om die probleem korter op te los. Laat ons 'n skikking van ons 'spelers' maak:

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

Soos jy kan sien, het die kruis in hierdie skikking sleutel 0, en die nul - sleutel 1. Dieselfde kan gesê word van i % 2 - vir die kruis sal die res 0 wees, en vir die nul - 1.

Dit wil sê hierdie ding kan in plaas van die sleutel gebruik word:

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

console.log(gamers[key]);

Of selfs korter:

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

Of nog korter:

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

Laat ons nou die kode van ons funksie start vereenvoudig:

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

Doen dit selfstandig, sonder om na my kode te kyk, voer die beskryfde wysiging in.

Tans kan op enige sel 'n onbeperkte aantal klieke gedoen word, wat byvoorbeeld die kruis na 'n nul verander. Regverdig dit.