How to Convert a Number to a String in JavaScript?

You can convert an integer to a string in JavaScript, in the following ways:

Using the String Wrapper Object

You can convert an integer to a string by using the String wrapper object, for example, like so:

String(12345); // '12345'
String(-12345); // '-12345'

This would result in a new String primitive.

If the variable holding the integer can potentially be null, undefined, etc., then please be aware that those would be converted to strings as is:

String(null); // 'null'
String(undefined); // 'undefined'

String(true); // 'true'
String(false); // 'false'

String(NaN); // 'NaN'

Using the Number.prototype.toString() Method

You can't directly call the toString() method on a number literal:

// Uncaught SyntaxError: Invalid or unexpected token
12345.toString();

For toString() to work with numbers, you can do any the following:

// wrap the number in parentheses and then call toString()

console.log((12345).toString()); // '12345'
console.log((-12345).toString()); // '-12345'
// put the number in a variable and then call toString()

const posNum = 12345;
console.log(posNum.toString()); // '12345'

const negNum = -12345;
console.log(negNum.toString()); // '-12345'
// use a dot after the number

console.log(12345..toString()); // '12345'
// this is the same as:
console.log(12345.0.toString()); // '12345'

console.log(-12345..toString()); // '-12345'
// this is the same as:
console.log(-12345.0.toString()); // '-12345'
// wrap the number with Number() and then call toString()

console.log(Number(12345).toString()); // '12345'
console.log(Number(-12345).toString()); // '-12345'

The reason why toString() method works on a primitive (such as a number) is because when properties/methods (such as Number.prototype.toString()) are accessed on primitives, JavaScript auto-boxes the value into a wrapper object (i.e. Number(12345)), which allows it to access the property/method on that object (e.g. (12345).toString()).

If the integer you wish to convert to string is in a variable, and that variable can potentially be undefined or null, then please be aware that calling toString() will throw an error:

const num = undefined;

// TypeError: Cannot read properties of undefined (reading 'toString')
console.log(num.toString());
const num = null;

// TypeError: Cannot read properties of null (reading 'toString')
console.log(num.toString());

However, same is not true if the variable holds the value NaN. Instead NaN is converted to a string as is:

const num = NaN;

console.log(num.toString()); // 'NaN'

This is because NaN itself is of type number:

typeof NaN; // 'number'

Concatenating the Number to a String

When a number literal is used in a string concatenation, the number value is automatically coerced into a string:

const str = 'Hi, I am ' + 21 + ' years old';

console.log(typeof str); // 'string'

This means that you can use an empty string in a concatenation to convert an integer to a string:

const numericStr = 12345 + '';

console.log(numericStr); // '12345'
console.log(typeof numericStr); // 'string'
const numericStr = -12345 + '';

console.log(numericStr); // '-12345'
console.log(typeof numericStr); // 'string'

The empty string can be placed before or after the number; the order of it does not matter:

const numericStr = '' + 12345;

console.log(numericStr); // '12345'
console.log(typeof numericStr); // 'string'
const numericStr = '' + -12345;

console.log(numericStr); // '-12345'
console.log(typeof numericStr); // 'string'

In practice you should avoid using this method if you're using string concatenation solely for converting an integer to a string. This is because it makes the code not very readable and the intention (of integer to string conversion) is not immediately clear. Perhaps, depending on your needs, you should instead consider using the String() wrapper object or the toString() method.

If the variable holding the integer can potentially be null, undefined, etc., then please be aware that those would be converted to strings as is:

null + ''; // 'null'
undefined + ''; // 'undefined'

true + ''; // 'true'
false + ''; // 'false'

NaN + ''; // 'NaN'

Using Template Literal Syntax

Introduced in ES6, you may use the template literal (template string) syntax to convert a number to a string:

// ES6+
const num = 12345;
const numericStr = `${num}`;

console.log(numericStr); // '12345'
console.log(typeof numericStr); // 'string'
// ES6+
const num = -12345;
const numericStr = `${num}`;

console.log(numericStr); // '-12345'
console.log(typeof numericStr); // 'string'

If the variable holding the integer can potentially be null, undefined, etc., then please be aware that those would be converted to strings as is:

// ES6+
`${null}`; // 'null'
`${undefined}`; // 'undefined'

`${true}`; // 'true'
`${false}`; // 'false'

`${NaN}`; // 'NaN'

Using the template literal syntax solely for the purpose of converting integers to strings might not be the best idea as it does not make the intention immediately clear. Perhaps, depending on your needs, you could instead consider using the String() wrapper object or the toString() method.


This post was published by Daniyal Hamid. Daniyal currently works as the Head of Engineering in Germany and has 20+ years of experience in software engineering, design and marketing. Please show your love and support by sharing this post.