Swapping Two Array Elements in JavaScript

Table of contents

Reading Time: 3 minutes

There are times when you need to swap two elements in an array in JavaScript while working with arrays.

The bubble sort algorithm, for example, requires you to compare two numbers and swap them if your condition is true. This may be the algorithm question you’re working on.

Apart from that, many other situations may require you to swap array elements.

Here is an illustration of what I mean by “swapping” in case you don’t already know what I mean. As seen in the example below, let’s say you have an array of numbers and you want to swap the element at index 1 (which is 4), with the value at index 0 (which is 2):

let number = [2, 4, 6, 8, 19];

let number = [4, 2, 6, 8, 19];

This blog will help you with three approaches: using a temporary variable, destructuring, and using the splice() array method.

How to Swap Two Array Elements With a Temporary Variable

We can swap the numbers by using the temp variable in just three steps:

The first step is to create a temporary variable to hold the first element’s value.
Setting the value of the first element to the value of the second element is the second step.
The second element’s value is set to the value in the temporary variable in the third step.

let myArray = [2, 4, 6, 8, 19];

const temp = myArray[0];

myArray[0] = myArray[1];

myArray[1] = temp;

console.log(myArray); // [4, 2, 6, 8, 19]

The array and the two indexes you want to swap can both be specified in a reusable function you construct to handle this.

const swapElements = (array, index1, index2) => {

    let temp = array[index1];

    array[index1] = array[index2];

    array[index2] = temp;
};

let myArray = [2, 4, 6, 8, 19];

swapElements(myArray, 0, 1);

console.log(myArray); // [4, 2, 6, 8, 19]

How to Swap Two Array Elements by Destructuring

Destructuring is a much better way to swap array elements because it just requires one line of code.

Simply create a new array with both elements in a specific order, then assign that array’s elements to another array with both elements in the opposite order.

let myArray = [2, 4, 6, 8, 19];

[myArray[0], myArray[1]] = [myArray[1], myArray[0]];

console.log(myArray); // [4, 2, 6, 8, 19]

The array and the two indexes you want to swap can both be specified in a reusable function you construct to handle this.

const swapElements = (array, index1, index2) => {

    [myArray[index1], myArray[index2]] = [myArray[index2], myArray[index1]];

};

let myArray = [2, 4, 6, 8, 19];

swapElements(myArray, 0, 1);

console.log(myArray); // [4, 2, 6, 8, 19]

How to Swap Two Array Elements With the `Splice()` Method

You can also employ the splice() array method. This method allows you to remove one or more elements from an array and replace them with any other element you specify.

// Syntax

array.splice(index, howmany, element1, ....., elementX)

To delete a specific element from an array, for instance, you would need to supply the element’s id and the number of items you wish to remove. In our situation, there is only one.

let myArray = [2, 4, 6, 8, 19];

myArray.splice(1, 1);

console.log(myArray); // 4, 2, 6, 8, 19]

Also, if you want to replace the removed element with another, your code will look like this:

let myArray = [2, 4, 6, 8, 19];

myArray.splice(1, 1, 32);

console.log(myArray); // [4, 2, 6, 8, 19]

But if you want to swap two elements, you will have something like this:

let myArray = [2, 4, 6, 8, 19];

myArray[0] = myArray.splice(1, 1, myArray[0])[0];

console.log(myArray); // [4, 2, 6, 8, 19]

You can also create a reusable function to handle this whereby you specify the array and the two indexes you wish to swap:

const swapElements = (array, index1, index2) => {

    myArray[index1] = myArray.splice(index2, 1, myArray[index1])[0];
};


let myArray = [2, 4, 6, 8, 19];

swapElements(myArray, 0, 1);

console.log(myArray); // [4, 2, 6, 8, 19]