Converting numbers to strings javascript

5 ways to convert a number to string in JavaScript

In JavaScript, you can represent a number as type number (ex. 12), or as a type string (ex. ’12’).But both are not same. At times while coding we might have to convert the data from one type to other and there are many ways to do that. I would like to list few of the methods I know of data conversion from number to string.

1. Using .toString() method

There is a default string method that converts the data to string. The toString() method returns the value of a String object.

myNumber = 100 myNumber.toString() // expected result: '100' noNumber = NaN noNumber.toString() // expected result: 'NaN' decNum = 122.33 decNum.toString() // expected result: "122.33" 

2. Using String()

myNumber = 99 String(myNumber) // expected result: '99' fltNumber = 25.54 String(fltNumber) // expected result: '25.54' 

3. Concatenating the Empty String

Adding empty string to the number value will convert the data to string is one of the simplest way to do the job. It is also considered to be faster than the above two when it comes to performance.

myNumber = 22 myString = '' + myNumber // expected result: '22' fltNumber = 25.54 fltString = '' + fltNumber // expected result: '25.54' 

4. Template Strings

With the introduction of template strings in ES6, injecting a number inside a String is a valid way of parsing an Integer or Float data type. This is the fastest way to convert the number to string.

myNumber = 22 flt = 50.205; string = `$`; // expected result: '50' floatString = `$`; // expected result: '50.205' 

5. Using toFixed() method

myNumber = 22 myNumber.toFixed() // expected result: '22' a = 56.9887 a.toFixed() // expected result: '57' a.toFixed(4) // expected result: '56.9887' 

Here is the comparison of the methods when it comes to the performance. Comment below if you know more ways.
Thank you

Источник

JavaScript Number toString()

The toString() method is used internally by JavaScript when an object needs to be displayed as a text (like in HTML), or when an object needs to be used as a string.

Normally, you will not use it in your own code.

Syntax

Parameters

Parameter	Description
radix	Optional. The base to use. Must be an integer between 2 and 36. Base 2 is binary Base 8 is octal Base 16 is hexadecimal.

Return Value

More Examples

Convert a number to a string, using base 8 (Octal):

Convert a number to a string, using base 16 (Hexadecimal):

Browser Support

toString() is an ECMAScript1 (ES1) feature.

ES1 (JavaScript 1997) is fully supported in all browsers:

Chrome	Edge	Firefox	Safari	Opera	IE
Yes	Yes	Yes	Yes	Yes	Yes

COLOR PICKER

Report Error

If you want to report an error, or if you want to make a suggestion, do not hesitate to send us an e-mail:

Thank You For Helping Us!

Your message has been sent to W3Schools.

Top Tutorials

Top References

Top Examples

Get Certified

W3Schools is optimized for learning and training. Examples might be simplified to improve reading and learning. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using W3Schools, you agree to have read and accepted our terms of use, cookie and privacy policy.

Источник

JavaScript Number to String – How to Use toString to Convert an Int into a String

Nathan Sebhastian

The toString() method is a built-in method of the JavaScript Number object that allows you to convert any number type value into its string type representation.

How to Use the toString Method in JavaScript

To use the toString() method, you simply need to call the method on a number value. The following example shows how to convert the number value 24 into its string representation. Notice how the value of the str variable is enclosed in double quotation marks:

var num = 24; var str = num.toString(); console.log(num); // 24 console.log(str); // "24"

You can also call the toString() method immediately on a number value, but you need to add parentheses () to wrap the value or JavaScript will respond with an Invalid or unexpected token error.

The toString() method can also convert floating and negative numbers as shown below:

24.toString(); // Error: Invalid or unexpected token (24).toString(); // "24" (9.7).toString(); // "9.7" (-20).toString(); // "-20"

Finally, the toString() method also accepts the radix or base parameter. The radix allows you to convert a number from the decimal number system (base 10) to a string representing the number in other number systems.

Valid number systems for conversion include:

• Binary system (base 2) that has 2 digits, 0 and 1
• Ternary system (base 3) that has 3 digits 0, 1, and 2
• Quaternary system (base 4) that has 4 digits, 0, 1, 2 and 3
• And so on up to the Hexatridecimal system (base 36) that has the combination of Arabic numerals 0 to 9 and Latin letters A to Z

The radix parameters accept a number type data with values ranging from 2 to 36 . Here’s an example of converting the decimal number 5 to its binary number (base 2) representation:

var str = (5).toString(2); console.log(str); // "101"

The decimal number 5 from the code above is converted to its binary number equivalent of 101 and then converted to a string.

How to Use Other Data Types with the toString() Method

Aside from converting the number type, the toString() method is also available for converting other data types into their string representations.

For example, you can convert an array type into its string representation as follows:

var arr = [ "Nathan", "Jack" ]; var str = arr.toString(); console.log(str); // "Nathan,Jack"

Or a boolean type to string as shown below:

var bool = true; var str = bool.toString(); console.log(str); // "true"

But I think you will most often use the toString() method to convert a number to a string instead of the others. That’s what I usually do, too 🙂

Thanks for reading this tutorial

You may also be interested in other JavaScript tutorials that I’ve written, including Rounding Numbers with toFixed() Method and Calculating Absolute Value with Math.abs() . They are two of the most commonly asked JavaScript problems.

I also have a free newsletter about web development tutorials (mostly JavaScript-related).

Nathan Sebhastian

JavaScript Full Stack Developer currently working with fullstack JS using React and Express. Nathan loves to write about his experience in programming to help other people.

If you read this far, tweet to the author to show them you care. Tweet a thanks

Learn to code for free. freeCodeCamp’s open source curriculum has helped more than 40,000 people get jobs as developers. Get started

freeCodeCamp is a donor-supported tax-exempt 501(c)(3) charity organization (United States Federal Tax Identification Number: 82-0779546)

Our mission: to help people learn to code for free. We accomplish this by creating thousands of videos, articles, and interactive coding lessons — all freely available to the public. We also have thousands of freeCodeCamp study groups around the world.

Donations to freeCodeCamp go toward our education initiatives, and help pay for servers, services, and staff.

Источник

Преобразование типов

Чаще всего операторы и функции автоматически приводят переданные им значения к нужному типу.

Например, alert автоматически преобразует любое значение к строке. Математические операторы преобразуют значения к числам.

Есть также случаи, когда нам нужно явно преобразовать значение в ожидаемый тип.

В этой главе мы не касаемся объектов. Сначала мы разберём преобразование примитивных значений.

Мы разберём преобразование объектов позже, в главе Преобразование объектов в примитивы.

Строковое преобразование

Строковое преобразование происходит, когда требуется представление чего-либо в виде строки.

Например, alert(value) преобразует значение к строке.

Также мы можем использовать функцию String(value) , чтобы преобразовать значение к строке:

let value = true; alert(typeof value); // boolean value = String(value); // теперь value это строка "true" alert(typeof value); // string

Преобразование происходит очевидным образом. false становится «false» , null становится «null» и т.п.

Численное преобразование

Численное преобразование происходит в математических функциях и выражениях.

Например, когда операция деления / применяется не к числу:

alert( "6" / "2" ); // 3, строки преобразуются в числа

Мы можем использовать функцию Number(value) , чтобы явно преобразовать value к числу:

let str = "123"; alert(typeof str); // string let num = Number(str); // становится числом 123 alert(typeof num); // number

Явное преобразование часто применяется, когда мы ожидаем получить число из строкового контекста, например из текстовых полей форм.

Если строка не может быть явно приведена к числу, то результатом преобразования будет NaN . Например:

let age = Number("Любая строка вместо числа"); alert(age); // NaN, преобразование не удалось

Правила численного преобразования:

Значение	Преобразуется в…
undefined	NaN
null	0
true / false	1 / 0
string	Пробельные символы (пробелы, знаки табуляции \t , знаки новой строки \n и т. п.) по краям обрезаются. Далее, если остаётся пустая строка, то получаем 0 , иначе из непустой строки «считывается» число. При ошибке результат NaN .

alert( Number(" 123 ") ); // 123 alert( Number("123z") ); // NaN (ошибка чтения числа на месте символа "z") alert( Number(true) ); // 1 alert( Number(false) ); // 0

Учтите, что null и undefined ведут себя по-разному. Так, null становится нулём, тогда как undefined приводится к NaN .

Большинство математических операторов также производит данное преобразование, как мы увидим в следующей главе.

Логическое преобразование

Логическое преобразование самое простое.

Происходит в логических операциях (позже мы познакомимся с условными проверками и подобными конструкциями), но также может быть выполнено явно с помощью функции Boolean(value) .

• Значения, которые интуитивно «пустые», вроде 0 , пустой строки, null , undefined и NaN , становятся false .
• Все остальные значения становятся true .

alert( Boolean(1) ); // true alert( Boolean(0) ); // false alert( Boolean("Привет!") ); // true alert( Boolean("") ); // false

Некоторые языки (к примеру, PHP) воспринимают строку «0» как false . Но в JavaScript, если строка не пустая, то она всегда true .

alert( Boolean("0") ); // true alert( Boolean(" ") ); // пробел это тоже true (любая непустая строка это true)

Итого

Существует 3 наиболее широко используемых преобразования: строковое, численное и логическое.

Строковое – Происходит, когда нам нужно что-то вывести. Может быть вызвано с помощью String(value) . Для примитивных значений работает очевидным образом.

Численное – Происходит в математических операциях. Может быть вызвано с помощью Number(value) .

Преобразование подчиняется правилам:

Значение	Становится…
undefined	NaN
null	0
true / false	1 / 0
string	Пробельные символы по краям обрезаются. Далее, если остаётся пустая строка, то получаем 0 , иначе из непустой строки «считывается» число. При ошибке результат NaN .

Логическое – Происходит в логических операциях. Может быть вызвано с помощью Boolean(value) .

Значение	Становится…
0 , null , undefined , NaN , «»	false
любое другое значение	true

Большую часть из этих правил легко понять и запомнить. Особые случаи, в которых часто допускаются ошибки:

• undefined при численном преобразовании становится NaN , не 0 .
• «0» и строки из одних пробелов типа » » при логическом преобразовании всегда true .

В этой главе мы не говорили об объектах. Мы вернёмся к ним позже, в главе Преобразование объектов в примитивы, посвящённой только объектам, сразу после того, как узнаем больше про основы JavaScript.

Источник