JavaScript - swap two variables

In this article, we would like to show you how to swap two variables in JavaScript.

Quick solution:

[a, b] = [b, a];

1. Using destructuring assignment (ES6+)

In this example, we use destructuring assignment to swap values of a and b variables.

// ONLINE-RUNNER:browser;

var a = 1;
var b = 2;

[a, b] = [b, a];

console.log(a); // 2
console.log(b); // 1

2. Using temporary variable

In this example, we use tmp temporary variable to swap a and b variables in three steps:

1. assign the value of a variable to the tmp,
2. assign a variable with the value of b,
3. assign b variable with the value of tmp (which have the initial value of a).

// ONLINE-RUNNER:browser;

var a = 1;
var b = 2;
var tmp;

tmp = a;
a = b;
b = tmp;

console.log(a); // 2
console.log(b); // 1

3. Using mathematical operations

In this example, we use addition and subtraction to swap values of a and b variables.

// ONLINE-RUNNER:browser;

var a = 1;
var b = 2;

a = a + b;
b = a - b;
a = a - b;

console.log(a); // 2
console.log(b); // 1

4. Using bitwise XOR operator

In this example, we use the XOR operator to swap values of a and b variables.

Note: With this solution, you can swap only integers.

// ONLINE-RUNNER:browser;

var a = 1; // 0001
var b = 2; // 0010

a = a ^ b; // 0011
b = a ^ b; // 0001
a = a ^ b; // 0010

console.log(a); // 2
console.log(b); // 1

XOR operator:

┌─────┬─────┬───────┐
│  a  │  b  │ a ^ b │
├─────┼─────┼───────┤
│  0  │  0  │   0   │
│  1  │  1  │   0   │
│  0  │  1  │   1   │
│  1  │  0  │   1   │
└─────┴─────┴───────┘

See also

1. JavaScript - bitwise XOR operator

2. JavaScript - array destructuring with rest parameter

References

1. Bitwise XOR (^) - JavaScript | MDN
2. Destructuring assignment - JavaScript | MDN