Analisis Pergantian Silang dan Bulat

Dalam pelajaran ini, saya ingin menunjukkan kepada Anda, bagaimana cara membuat pergantian silang dan bulat dalam satu baris kode. Anda kemungkinan besar, telah membuat sesuatu seperti ini:

function start(cells) {
	let i = 0; // nilai awal penghitung
	
	for (let cell of cells) {
		cell.addEventListener('click', function() {
			if (i % 2 == 0) {
				this.textContent = 'X';
			} else {
				this.textContent = '0';
			}
			
			i++; // tingkatkan penghitung
		});
	}
}

Saya akan menawarkan untuk memecahkan masalah lebih pendek. Mari buat array dari 'pemain' kita:

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

Seperti yang Anda lihat, dalam array ini silang memiliki kunci 0, dan bulat - kunci 1. Hal yang sama dapat dikatakan untuk i % 2 - untuk silang sisanya akan 0, dan untuk bulat - 1.

Artinya, hal ini dapat digunakan sebagai pengganti kunci:

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

console.log(gamers[key]);

Atau lebih pendek lagi:

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

Atau bahkan lebih pendek:

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

Sekarang mari sederhanakan kode fungsi start kita:

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

Secara mandiri, tanpa melihat kode saya, terapkan perubahan yang dijelaskan.

Saat ini, pada sel mana pun dapat dilakukan klik yang tidak terbatas jumlahnya, mengubah, misalnya, silang menjadi bulat. Perbaiki ini.