javascript array empty and undefined

Question

I have a question about empty and undefined in array

please see my codes bottom

const arr = []
arr[1]=1
arr[2]=2
arr[3]=3
arr[5]=5
console.log(arr[4])// console: undefined
console.log(arr)// console: [empty, 1,2,3,empty,5]

so I didn't understand difference between two colsole result

why console.log(arr[4]) is undefined but console.log(arr)'s index 4 is empty?

please help me thank you

Answer 1

The word empty is added by the console interface of the browser.

The correct state of an unassigned array element is undefined - and this is given to you by JS when you try to access it. Besides this, the interpretation of unassigned array elements is subjected to the system which interprets it.

Here are some examples:

let arr = new Array(2);

console.log(arr[0]);    //undefined

console.log(arr);       //In SO - [undefined, undefined]. In browser [empty x 2]    

console.log(JSON.stringify(arr));   // [null, null]

Answer 2

When you read a property which doesn’t exist you get the value undefined. That’s standard JS.

When you log a whole array, you aren’t reading the property explicitly, so the console helpfully distinguishes between “has no value” and “explicitly has the undefined value”.