How to Concatenate Two Numbers in JavaScript

Concatenate Two Numbers in JavaScript #

To concatenate two numbers, add an empty string to the numbers, e.g. "" + 1 + 2.

When the addition (+) operator is used with a string and a number, it concatenates the values and returns the result.

Copied!
const num1 = 1;
const num2 = 2;

const result = '' + num1 + num2;
console.log(result); // 👉️ '12'

console.log(typeof result); // string

We used the addition (+) operator to concatenate two numbers.

When used with a number and a string, the + operator concatenates them.

Copied!
console.log(3 + 'bobbyhadz'); // 👉️ '3bobbyhadz'
console.log(1 + '10'); // 👉️ '110'
console.log('100' + 200); // 👉️ '100200'

Copied!
const num1 = 1;
const num2 = 2;

const str = '' + num1 + num2;

console.log(str); // 👉️ 12
console.log(typeof str); // string

// 👇️ convert back to number
const num = Number(str);

console.log(num); // 12
console.log(typeof num); // 👉️ number

If you add the string at the end, the numbers would get added and the string would just convert the result to a string.

Copied!
// ⛔️ Doesn't work
console.log(1 + 5 + ''); // 👉️ "6"

// ✅ Works
console.log('' + 1 + 5); // 👉️ "15"

If you have to do this often, define a reusable function.

Copied!
function concatenateNumbers(num1, num2) {
  return '' + num1 + num2;
}

console.log(concatenateNumbers(1, 2)); // 👉️ '12'
console.log(concatenateNumbers(5, 6)); // 👉️ '56'

The function takes two numbers as parameters and concatenates them.

Alternatively, you can use the Array.join() method.

Concatenate Two Numbers in JavaScript using Array.join() #

To concatenate two or more numbers:

1. Wrap the numbers in an array.
2. Use the Array.join() method to join the numbers into a string without a separator.

Copied!
function concatenateNumbers(numbers) {
  return numbers.join('');
}

console.log(concatenateNumbers([1, 2])); // 👉️ '12'
console.log(concatenateNumbers([1, 2, 3])); // 👉️ '123'
console.log(concatenateNumbers([1, 2, 3, 4])); // 👉️ '1234'

We wrapped two or more numbers in an array and used the Array.join() method to concatenate them.

The Array.join() method concatenates all of the elements in an array using a separator.

If the separator argument is set to an empty string, the array elements are joined without any characters in between them.

Copied!
console.log([1, 2, 3].join('')); // 👉️ '123'

You can also use a template literal to concatenate two numbers.

Concatenate Two Numbers in JavaScript using a template literal #

Use a template literal to concatenate two numbers, e.g. const result = ${num1}${num2};.

The dollar sign and curly braces part ${} is an expression that gets evaluated.

Copied!
const num1 = 1;
const num2 = 2;

const result = `${num1}${num2}`;

console.log(result); // 👉️ '12'

You can imagine that the num1 and num2 variables get evaluated and the numbers get converted to strings and concatenated.

You can use this approach to concatenate as many numbers as necessary.

Copied!
const num1 = 1;
const num2 = 2;
const num3 = 3;

const result = `${num1}${num2}${num3}`;

console.log(result); // 👉️ '12'

Which approach you pick is a matter of personal preference. The Array.join() method is convenient if you need to concatenate a collection of numbers, otherwise, the other two options should suffice.