As a newbie in Javascript, knowing how to do several operations on arrays is important, hence this article.

Introduction

Array class is a global object that is used in the construction of arrays in javascript. It stores several pieces of data in a single variable. Declaring an array:

let names = []; //Initial Array declaration in JS

Arrays can contain multiple data types:

let arr = ['hello', 1, 2, 3, true, 'hi'];

Access Array Data with indexes

Array indexing is the same as accessing an array element. You can access an array element by referring to its index number. The indexes in arrays start with 0, meaning that the first element has index 0, and the second has index 1 etc.

let names = ['John', 'Sarah',  ['Doe', 'Victor'], 'Leo', 'Adam'];
names[0];
console.log(names); //returns ['John'];

Basic Javascript Array Methods

The full functionality of Javascript arrays can be found in its manipulation by using several methods. Each method make coding a lot easier and also make your code look clean and easy to understand.

push( )

This method adds one or more elements to the end of array and returns the new length of the array. It increases the length of the array.

const names = ['John', 'Sarah', 'Dan'];
names.push('Will', 'Bill');
console.log(names); //['John', 'Sarah', 'Dan', 'Will', 'Bill'];

pop( )

This method removes the last element from the end of array and returns that element. This method changes the length of the array.

const names = ['John', 'Sarah', 'Dan'];
names.pop();
console.log(names); //['John', 'Sarah'];

shift( )

This method removes the first element from an array and returns that element.

const names = ['John', 'Sarah', 'Dan'];
names.shift();
console.log(names); //['Sarah', 'Dan'];

unshift( )

This method adds one or more elements to the beginning of an array and returns the new length of the array.

const names = ['John', 'Sarah', 'Dan'];
names.unshift('Adam');
console.log(names); //['Adam', 'John', 'Sarah', 'Dan'];

slice( )

This method returns a new array with specified start to end elements.

const names = ['John', 'Sarah', 'Dan'];
names.slice(2);
console.log(names); // ['Dan'];

splice( )

This method changes the contents of an array by removing or replacing existing elements and/or adding new elements. It takes the following parameters:

• Start: The index at which to start changing the array.

• deleteCount (Optional): An integer indicating the number of elements in the array to remove from start.

• item1, item2, ... (Optional): The elements to add to the array, beginning from start. If you do not specify any elements, splice() will only remove elements from the array.

let names = ['Adam', 'John', 'Sarah', 'Dan', 'Victor'];
names.splice(3, 1);
console.log(names); //['Adam', 'John', 'Sarah', 'Victor'];

Learn about other array methods here:

MDN

Freecodecamp

Conclusion

Arrays possesses more methods that can be used for modifying and manipulating data. Recently, Javascript ES6 introduced more non-mutating methods for modifying arrays, and these methods will be covered in a future article, I hope you find this helpful! Please feel free to like, comment and share :) .