JavaScript Arrays

An array is the collection of ordered items. These ordering collections make array index zero-based.

Creating and Accessing an Array

Creating an Array

Arrays are created as an object. See the syntax below:

array = new Array(item1, item2, ...,itemN);

The above syntax can be rewritten as shown below:

array = [ item1, item2, ...,itemN ];

The items, item1, item2, ...,itemN are of any data type.

See the example below:

// const arr = new Array(true, "Bob", 34, 7n);
const arr = [ true, "Bob", 34, 7n  ];

Alternatively, you can append elements to an element.

const arr = [];

arr[0] = true;
arr[1] = "Bob";
arr[2] = 34,
arr[3] = 7n

console.log(arr); // [ true, "Bob", 34, 7n  ]

Accessing an Array

Arrays items are in order or numbered starting from zero (0, 1, ..., N).

See the example below:

const arr = [ true, "Bob", 34, 7n  ];

console.log( arr[0] ) // true
console.log( arr[1] ) // Bob
console.log( arr[2] ) // 34
console.log( arr[3] ) // 7n

The length number property determines the number of items in an array.

See the example below:

const arr = [ true, "Bob", 34, 7n  ];

arr.length; // 4

The example above shows the array's last item index is arr.length - 1.

See the example below:

const arr = [ true, "Bob", 34, 7n  ];

arr[arr.length - 1]; // 7n

Trailing comma

An array, just like an object, may end with a comma:

const arr = [
  'Melon', 
  { name: 'Bello' }, 
  true, 
  function() { 
    console.log('Hello World!'); 
  } 
];

console.log( arr[1].name ); // Bello

arr[3](); // Hello World!

Array is an object and thus behaves like an object.

typeof arr; // object

Array queue

In computer science, ordered collection of elements supports two operations:

• push
• shift

push

The push method appends an item to an array.

See the example below:

const fruits = [ "Apple", "Orange" ];

fruits.push("Melon");

console.log( fruits ); // [ 'Apple', 'Orange', 'Melon' ]

The above example can be rewritten as shown below:

const fruits = [ "Apple", "Orange" ];

fruits[fruits.length] = "Melon";

console.log( fruits ); // [ 'Apple', 'Orange', 'Melon' ]

shift

Opposite to the push method, an item can be removed (and returned) at the beginning of an array.

const fruits = [ "Apple", "Orange", "Melon" ];

console.log( fruits.shift() ); // Apple => returned removed item

console.log( fruits ); // [ 'Orange', 'Melon' ]

Array stack

In computer science, ordered collection of elements supports two operations:

• push
• pop

pop

The pop method removes the last element of the array and returns it:

const fruits = [ "Apple", "Orange", "Melon" ];

console.log( fruits.pop() ); // Melon => returned removed item

console.log( fruits ); // [ 'Apple', 'Orange' ]

The shift method removes an element from the beginning of an array; while the pop method removes an element from the end of an array.

See the example below:

const fruits = [ "Apple", "Orange", "Melon" ];

fruits.shift();

console.log(fruits); // [ "Orange", "Melon" ]

The example above is the same as below:

const fruits = [ "Apple", "Orange", "Melon" ];

fruits[0] = fruits[1]; // [ 'Orange', 'Orange', 'Melon' ]
fruits[1] = fruits[fruits.length-1]; // [ 'Orange', 'Melon', 'Melon' ]
fruits[fruits.length-1] = fruits[fruits.length]; 
// [ 'Orange', 'Melon', undefined ]

console.log( fruits.pop() ); // undefined

console.log(fruits); // [ "Orange", "Melon" ]

Methods push/pop run fast, while shift/unshift are slow.

For stacks the principle is based on LIFO (Last-In-First-Out) while queues, FIFO (First-In-First-Out) principle. In computer science, the data structure that allows this is called deque.

unshift

The unshift method is the opposite of push, it adds an element to the beginning of an array.

const fruits = [ "Orange", "Melon" ];

fruits.unshift("Apple");

console.log(fruits) // [ Apple, "Orange", "Melon" ]

Happy coding