JavaScript

How to Swap Array Elements in JavaScript

In the process of maintaining the bulk of data, swapping is a very important feature for appropriately managing incorrect or outdated data. For instance, when you need to update some particular record for an update. In such a scenario, swapping array elements in JavaScript is a very useful feature for updating all the records at once, which also saves time.

This article will demonstrate the methods to swap the elements in an array using JavaScript.

How to Swap Array Elements in JavaScript?

To swap the elements in an array using JavaScript, the following techniques can be applied:

  • Indexing” Technique
  • Destructor” Assignment
  • splice()” Method

 

The mentioned approaches will be discussed one by one!

Method 1: Swap Array Elements in JavaScript Using Indexing Technique

The “Indexing” technique can be applied to equalize the array elements based on their indexes and store them in a variable in such a way that they are swapped.

Look at the below-given example.

Example

In this example, we will declare an array of some integer values and display them on the console:

let arrayElements = [2, 4, 20, 40];
console.log("The original array elements are:", arrayElements);

After that, access the array’s first element by referring to its index “0” and store it in a variable named “store”:

const store = arrayElements[0];

In the next step, equalize the array’s first element with the second element as demonstrated below:

arrayElements[0] = arrayElements[1];

Now, equalize the array’s second element to the variable “store” in which the array’s first element was stored. This will result in the swapping of both the first and second element present in an array:

arrayElements[1] = store;

Similarly, repeat the above-discussed steps for the third and fourth array element to swap them as well:

const store1 = arrayElements[2];
arrayElements[2] = arrayElements[3];
arrayElements[3] = store1;

Finally, print the swapped array elements on the console:

console.log("The swapped array elements are:", arrayElements);

The resultant output will be:

In the above output, it can be observed that the two former and the two latter array elements are swapped with each other.

Method 2: Swap Array Elements in JavaScript Using Destructor Assignment

The “Destructor Assignment” swaps the arrays more easily and requires only a single line of code. In this scenario, you only need to assign the arrays in square brackets and set the right side in a reversed sequence of array elements.

Example

First, we will declare two arrays with the following elements:

var x = [1, 3, 5];
var y = [2, 4, 6];

Next, apply the destructor assignment, which will access the arrays having a contrast in their sequence and display them:

[x,y] = [y,x]
console.log("The swapped array elements are:")

Finally, observe if the array elements of one array are swapped with the other array or not:

console.log("First Array:", x)
console.log("Second Array:", y)

Output

In this particular output, it is evident that the array elements of both the arrays are swapped.

Method 3: Swap Array Elements in JavaScript Using splice() Method

The “splice()” method adds or removes array elements by specifying them in its argument and changes the original array as well. This method can be implemented to divide the array elements into parts, then merge and append them in a new array.

Check out the following example for the demonstration.

Example

Firstly, we will declare an array with the following integer values and display them on the console:

let arrayElements = [12, -2, 55, 68];

console.log("The original array elements are:", arrayElements);

Then, create an empty array for appending the swapped array elements:

array=[]

After that, apply the “splice()” method to splice the array elements reversely and concatenate them:

var splice= arrayElements.splice(2, 4) + ',' + arrayElements.splice(0, 2)

Now, apply the “push()” method to append the swapped array elements into the empty array named “array”:

array.push(splice)

Finally, print the added spliced values resulting in the swapped array elements:

console.log("The swapped array elements are:", array)

Output

We have discussed different creative methods to swap array elements in JavaScript.

Conclusion

To swap array elements in JavaScript, apply the “indexing” technique to equalize the array elements and store them in a variable, the “destructor assignment” to access the arrays with a contrast in their elements sequence, or the “splice()” method to divide the array elements and push them into a new array in a reversed manner. This write-up illustrated the methods to swap array elements in JavaScript.

About the author

Umar Hassan

I am a Front-End Web Developer. Being a technical author, I try to learn new things and adapt with them every day. I am passionate to write about evolving software tools and technologies and make it understandable for the end-user.