Tic tac toe React.js

I don’t understand this code in time travel code const current = history[history.length - 1] . What does that mean? and why it’s not just history.length.
https://reactjs.org/tutorial/tutorial.html#adding-time-travel

Hi @HaithamCa !

The code means to grab the last element in the array.

For example,

const arr = [1,2,3,4]

So arr[arr.length -1] would be index 3.
At index 3 we have the number 4.

Hope that makes sense!

1 Like

Hello there,

This is a very common practice to see in programming. Seeing as many programming languages (including JavaScript) are zero-indexed, to access the first element of an array, you need to get the 0 index:

const myArr = [1, 2, 3, 4];
console.log(myArr[0]);

Now, if I wanted the last element, I would need myArr[3], as this is the fourth element at index 3 of the array.

So, running this code would produce unwanted results:

const myArr = [1, 2, 3, 4];
console.log(myArr[myArr.length]); // returns undefined

Because the length of myArr is 4, but there is no element at index 4.

Hope this helps

2 Likes

Thanks, it’s clear now. But unfortunately, I still confused in another part at the same code
const winner = calculateWinner(current.squares);. Now, current.squares this code becomes history[the last square I pressed].Array(9).fill(null) . I can’t imagine the logic of this code.

const winner = calculateWinner(current.squares); this code in the React tutorial CalculateWinner is a function return boolean value based who is a winner and current return the last squares I pressed. but what about squares, is that means Array(9).fill(null)?. It doesn’t make sense for me.

Remember to use the READ-SEARCH-ASK methodology.

Have a read of this:
Array() constructor - JavaScript | MDN (mozilla.org)

Hope this helps

Thanks for your response. I did a lot for this small point. :grinning: fortunalely, I find the solution in the next section of the same tutorial, and the problem was in .slice(). Sorry for the inconvenience.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.