Analysis of the X and O marks alternation

In this lesson, I want to show you how to make an alternation of a cross and a zero in one line. You most likely did something like this:

javascriptfunction start(cells) {
  let i = 0; // the counter initial value
  
  for (let cell of cells) {
    cell.addEventListener('click', function() {
      if (i % 2 == 0) {
        this.textContent = 'X';
      } else {
        this.textContent = '0';
      }
      
      i++; // increases the counter value
    });
  }
}

I will suggest to solve the problem in a shorter way. Let's make an array of our 'players':

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

As you can see, in this array, the X mark has the key 0, and the O mark has the key 1. The same can be said about i % 2 - for the X mark the remainder will be 0, and for the O mark - 1.

That is, this thing can be used instead of a key:

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

console.log(gamers[key]);

Or even shorter:

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

Or even shorter:

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

Let's simplify our start function code:

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