Last updated: Mar 3, 2024
Reading timeยท3 min
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.
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.
console.log(3 + 'bobbyhadz'); // ๐๏ธ '3bobbyhadz' console.log(1 + '10'); // ๐๏ธ '110' console.log('100' + 200); // ๐๏ธ '100200'
string
. If you need the result as a number, pass it to the Number()
constructor.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 will get added and the string would just convert the result to a string.
// โ๏ธ 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.
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.
Array.join()
This is a two-step process:
Array.join()
method to join the numbers into a string without a
separator.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.
Array.join()
method takes is a separator
- the string used to separate the elements of the array.If the separator
argument is set to an empty string, the array elements are
joined without any characters in between them.
console.log([1, 2, 3].join('')); // ๐๏ธ '123'
Alternatively, you can use a template literal.
The dollar sign and curly braces part ${}
is an expression that gets
evaluated.
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.
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.
I've also written an article on how to add strings as numbers in JS.
You can learn more about the related topics by checking out the following tutorials: