How to Append Value to an Array in JavaScript

In JavaScript, there are multiple methods to add an element to an array. You can append a single element, multiple elements, or even entire arrays. JavaScript provides built-in methods to add and remove elements from arrays. In this article, we will explore the different techniques to append values to arrays in JavaScript.

Using Array.push()

The simplest way to append an element is by using the push() method. It adds the element at the end of the array and returns the new length.

let fruits = ["Apple", "Banana"];

fruits.push("Orange"); // ["Apple", "Banana", "Orange"]

You can also append multiple elements by passing them as arguments to push():

let vegetables = ["Carrot", "Beans"];

vegetables.push("Eggplant", "Spinach"); 
// ["Carrot", "Beans", "Eggplant", "Spinach"]

Key things to note about push():

• It mutates the original array by appending elements at the end.
• It returns the new length of the array.
• Works on both arrays and array-like objects like arguments.

Using Array.unshift()

To append elements at the beginning of an array, use unshift(). It works similarly like push() but adds elements at the start.

let fruits = ["Orange", "Banana"];

fruits.unshift("Apple"); // ["Apple", "Orange", "Banana"]  

You can also pass multiple elements to unshift() to append them at the start:

let vegetables = ["Spinach", "Eggplant"];

vegetables.unshift("Carrot", "Beans"); 
// ["Carrot", "Beans", "Spinach", "Eggplant"]

Key things about unshift():

• Mutates the original array by prepending elements.
• Returns the new length of the array.
• Works on both arrays and array-like objects.

Using the Spread Operator

You can also append arrays using the spread (…) operator:

let array1 = [1, 2, 3];
let array2 = [4, 5, 6];

let concatenated = [...array1, ...array2]; 
// [1, 2, 3, 4, 5, 6]

The spread operator unpacks the elements of the arrays into the new array.

Some key benefits of using spread operator:

• Does not mutate the original arrays.
• Creates a new array.
• Can concatenate multiple arrays easily.

Using Array.concat()

The concat() method can also be used to merge arrays:

let array1 = [1, 2, 3];
let array2 = [4, 5, 6];

let concatenated = array1.concat(array2);
// [1, 2, 3, 4, 5, 6]  

You can concatenate multiple arrays using concat():

let array1 = [1, 2]; 
let array2 = [3, 4];
let array3 = [5, 6];

let concatenated = array1.concat(array2, array3);
// [1, 2, 3, 4, 5, 6]

Key things about concat():

• Does not change existing arrays but returns a new one.
• Can take any number of array arguments to concatenate.
• Works on both arrays and array-like objects.

So in summary, you have multiple options available in JavaScript to append to arrays dynamically. Choose the right method based on your specific requirements.