Javascript преобразование в строку. JavaScript: Преобразование типов данных

Существует два основных способа преобразования строки в число в javascript. Один из способов - проанализировать его, а другой способ - изменить его тип на число. Все трюки в других ответах (например, унарный плюс) подразумевают неявное принуждение типа строки к числу. Вы также можете сделать то же самое с функцией Number.

Синтаксический

Var parsed = parseInt("97", 10);

ParseInt и parseFloat являются две функции, которые используются для разбора строк в числа. Синтаксический анализ остановится молча, если он попадет в символ, который он не распознает, что может быть полезно для синтаксического анализа строк, например «92px», но это также несколько опасно, поскольку оно не даст вам никакой ошибки при плохом вводе, вместо этого вы "вернем NaN, если строка не начинается с числа. Пробел в начале строки игнорируется. Вот пример того, что делает что-то другое, что вы хотите, и не давая никаких указаний, что все пошло не так:

Var widgetsSold = parseInt("97,800", 10); // widgetsSold is now 97

Это хорошая практика, чтобы всегда указывать десятичную в качестве второго аргумента. В старых браузерах, если строка начиналась с 0, она была бы интерпретирована как восьмеричная, если бы не было указано значение radix, которое привлекло много людей врасплох. Поведение для шестнадцатеричного запуска запускается, если строка начинается с 0x, если не указано значение radix. 0xff . Стандарт фактически изменился с помощью ecmascript 5, поэтому современные браузеры больше не запускают восьмеричные, когда есть ведущее 0, если не указано никаких оснований. parseInt понимает радики до основания 36, и в этом случае как верхние, так и строчные буквы обрабатываются как эквивалентные.

Изменение типа струны на номер

Всех других приемов, упомянутых выше, которые не используют ParseInt, вовлекает неявно принуждать строку в число. Я предпочитаю делать это явно,

Var cast = Number("97");

Это отличается от методов анализа (хотя он по-прежнему игнорирует пробелы). Это более строгий: если он не понимает всю строку, чем возвращает NaN , поэтому вы не можете использовать ее для строк, таких как 97px . Поскольку вам требуется примитивное число, а не объект обертки Number, убедитесь, что перед функцией Number не ставьте new .

Очевидно, что преобразование в число дает значение, которое может быть float, а не целое число, поэтому, если вы хотите целое число, вам нужно его изменить. Есть несколько способов сделать это:

Var rounded = Math.floor(Number("97.654")); // other options are Math.ceil, Math.round var fixed = Number("97.654").toFixed(0); // rounded rather than truncated var bitwised = Number("97.654")|0; // do not use for large numbers

Любого оператор побитового (здесь я сделал побитовую или, но вы можете также сделать двойное отрицание, как в предыдущем ответе или Bitshift) преобразует значение 32-битное целое число, и большинство из них преобразуется в целое число со знаком. Обратите внимание, что это не будет хотеть, чтобы вы искали большие целые числа . Если целое число не может быть представлено в 32 битах, оно будет завершено.

~~"3000000000.654" === -1294967296 // This is the same as Number("3000000000.654")|0 "3000000000.654" >>> 0 === 3000000000 // unsigned right shift gives you an extra bit "300000000000.654" >>> 0 === 3647256576 // but still fails with larger numbers

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

Math.floor("3000000000.654") === 3000000000 // This is the same as Math.floor(Number("3000000000.654"))

Имейте в виду, что все эти методы понимают экспоненциальной нотации, так 2e2 является 200 , а не NaN. Кроме того, Number понимает «Бесконечность», в то время как методы анализа не делают этого.

Пользовательские

Это маловероятно, что любой из этих методов делает именно то, что вы хотите. Например, обычно мне нужна ошибка, возникающая при сбое синтаксического анализа, и мне не нужна поддержка Infinity, экспоненты или ведущие пробелы. В зависимости от вашего использования, иногда имеет смысл написать пользовательскую функцию преобразования.

Всегда проверяйте, что вывод числа или один из методов анализа - это вид ожидаемого числа. Вы почти наверняка захотите использовать isNaN , чтобы убедиться, что номер не NaN (обычно это единственный способ узнать, что синтаксический анализ не прошел).

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

Хотя из-за приведения типов JavaScript преобразовывает многие значения автоматически, для достижения ожидаемых результатов лучше всего преобразовывать типы данных вручную.

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

Неявное преобразование

Язык программирования JavaScript очень хорошо справляется с обработкой неожиданных значений. JavaScript не отклоняет неожиданные значения, а пытается преобразовать. Это неявное преобразование также называется приведением типов (type coercion).

Отдельные методы автоматически преобразовывают значения, чтобы использовать их. Метод alert() принимает строку в качестве своего параметра, а другие типы автоматически преобразует в строки. Таким образом, можно передать этому методу числовое значение:

Если запустить эту строку, браузер вернет всплывающее окно со значением 8.5, которое будет уже преобразовано в строку.

Используя строки, состоящие из чисел, вместе с математическими операторами, вы обнаружите, что JavaScript может обрабатывать значения, неявно преобразовывая строки в числа:

// Вычитание
"15" - "10";
5
// Модуль
"15" % "10";
5

Но не все операторы работают предсказуемо. Особенно это касается оператора +: он выполняет сложение чисел и конкатенацию строк.

// При работе со строками + выполняет конкатенацию
"2" + "3";
"23"

Поскольку оператор + имеет много предназначений, в этом примере он воспринимает значения 2 и 3 как строковые, несмотря на то, что они выражаются числовыми строками. Потому он объединяет строки «2» и «3» и получает 23, а не складывает 2 и 3 и получает 5.

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

Преобразование значений в строки

Чтобы явно преобразовать значение в строку, вызовите метод String() или n.toString().

Попробуйте преобразовать логическое значение true в строку с помощью String().

Это вернет строковый литерал «true».

Также можно попробовать передать функции число:

Она вернет строковый литерал:

Теперь попробуйте использовать String() с переменной. Присвойте числовое значение переменной odyssey и используйте оператор typeof, чтобы проверить тип.

let odyssey = 2001;
console.log(typeof odyssey);
number

На данный момент переменной odyssey присвоено числовое значение 2001. Оператор typeof подтверждает, что значение является числом.

Теперь присвойте переменной odyssey ее эквивалент внутри функции String(), а затем используйте typeof, чтобы убедиться, что значение переменной успешно преобразовано из числа в строку.

odyssey = String(odyssey); // "2001"
console.log(typeof odyssey);
string

Как видите, теперь переменная odyssey содержит строку.

Функция n.toString() работает аналогичным образом. Замените n переменной.

let blows = 400;
blows.toString();

Переменная blows будет содержать строку.

Вместо переменной можно поместить значение в круглых скобках:

(1776).toString(); // returns "1776"
(false).toString(); // returns "false"
(100 + 200).toString(); // returns "300"

String() и n.toString() явно преобразовывают логические и числовые значения в строки.

Преобразование значений в числа

Метод Number() может преобразовать значение в число. Часто возникает необходимость преобразовать строки, состоящие из чисел, но иногда преобразовывать нужно и логические значения.

Для примера передайте методу Number() такую строку:

Строка будет преобразована в число и больше не будет заключена в кавычки.

Также можно присвоить строку переменной и затем преобразовать ее.

let dalmatians = "101";
Number(dalmatians);
101

Строковый литерал «101» был преобразован в число 101.

Строки из пробелов или пустые строки будут преобразованы в число 0.

Number(" "); // returns 0
Number(""); // returns 0

Имейте в виду, что строки, которыйе не состоят из чисел, преобразуются в NaN, что означает Not a Number. Это относится и к числам, разделенным пробелами.

Number("twelve"); // returns NaN
Number("20,000"); // returns NaN
Number("2 3"); // returns NaN
Number("11-11-11"); // returns NaN

В логических данных значение false будет равно 0, а true будет равно 1.

Преобразование значений в логические значения

Чтобы преобразовать числа или строки в логические значения, используется метод Boolean(). К примеру, это помогает определить, вводит пользователь данные в текстовое поле или нет.

Любое значение, которое интерпретируется как пустое, например, число 0, пустая строка, значения undefined, NaN или null преобразуются в значение false.

Boolean(0); // returns false
Boolean(""); // returns false
Boolean(undefined); // returns false
Boolean(NaN); // returns false
Boolean(null); // returns false

Другие значения, включая строковые литералы, состоящие из пробелов, будут преобразованы в true.

Boolean(2000); // returns true
Boolean(" "); // returns true
Boolean("Maniacs"); // returns true

Обратите внимание: строковый литерал «0» преобразовывается в true, поскольку это не пустое значение:

Boolean("0"); // returns true

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

Заключение

Теперь вы знаете, как JavaScript преобразовывает типы данных. часто из-за приведения типов данные преобразовываются неявно, что может стать причиной возникновения неожиданных значений. Рекомендуется явно преобразовывать типы данных, чтобы гарантировать корректную работу программ.

Здравствуйте, дорогие читатели. Сегодня я напишу, как преобразовывается в javascript строка в число. Это делается с помощью функции Number , сейчас я покажу ее использование на примере.
Также предлагаю посмотреть видео-версию этой статьи:

Немного о типах данных

Как вы знаете, в javascript есть числовой и строковый тип данных. Давайте попробуем создать две переменных, в которые сохраним числа, а потом выведем результат на экран.

Var a = 5; var b = 12; document.write(a + b);

Каким будет результат? 17, что и вывел нам браузер. Итак, это числовые данные, поэтому браузер успешно их сложил. А теперь давайте создадим другие две переменные, в которые положим такие же значения, но в кавычках. Я напомню, все строки в javascript пишутся именно в кавычках.

Var c = "5"; var d = "12"; document.write("
" + c + d);

Теперь браузер считает наши данные строками и если мы их сложим, то просто будут сложены две строки и мы получим 512, что не есть правильным результатом если бы складывались числа, но является правильным, если поставить вместе две строки.

Как преобразовать в javascript строку в число?

Тут все просто, создадим очередные две переменные, в которые запишем то же значение, что задано переменным c и d , но пропустив их через метод Number:

Var e = Number(c); var f = Number(d); document.write(e + f);

Если вы теперь попробуете вывести результат от этого сложения на экран, то выведется 17. Все потому, что наш метод успешно отработал и преобразовал строку в число. Хочу отметить, что если вы напишите так:

Document.write("
" + e + f);

То на экран выведется 512, потому что при сложении строк и чисел ВСЕГДА результат преобразовывается в строку. Если вы хотите добавить перенос строки и при этом сохранить правильный результат, можно записать все в две строку или в одно следующим образом:

Document.write("
" + (e + f));

Если взять числа в скобки, то они не будут преобразованы в строки и успешно сохранят свои свойства. Вот такая вот короткая статья у меня сегодня. Надеюсь, javascript стал для вас чуточку понятней.

JavaScript - язык с динамической типизацией данных. Это значит, что в одну и ту же переменную можно записывать значения различных типов, при этом тип самой переменной будет меняться. Подобное поведение часто позволяет забыть о различном поведении переменных с разным типом, но помнить об этой особенности всё же необходимо. Покажем это на следующем примере.

console.log(sum(1, 2)); // 3 (тут всё ок) console.log(sum(1, "2")); // 12 (а тут не очень)

Как видно из примера функция sum некорректно себя ведёт, если в качестве хотя бы одного её аргумента передать не число. Дело в том, что при «сложении» числа со строкой, число преобразуется к строке и происходит его конкатенация (склеивание) со вторым операндом.

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

Оператор typeof

Этот унарный оператор принимает в качестве операнда абсолютно любое значение и возвращает его тип в строковой переменной.

В JavaScript существуют следующие типы данных:

// 1.) object console.log(typeof {}); // object var p = {x: 1, y: 3}; console.log(typeof p); // object // 2.) function function sayHello() { console.log("Hello!"); } console.log(typeof sayHello); // function // 3.) string console.log(typeof "JavaScript"); // string // 4.) number console.log(typeof 3.1415); // number // 5.) boolean console.log(typeof true); // boolean // 6.) undefined var notExistsOne; console.log(typeof notExistsOne); // undefined console.log(typeof notExistsTwo); // undefined

Обратите внимание, что undefined это тоже тип данных, который состоит из одного значения.

Приведение типов

Под приведением типов в программировании понимают преобразование значения переменной одного типа в значение другого типа.
Часто такое преобразование происходит без контроля со стороны программиста. Это можно было видеть в примере с функцией sum . Изменение типа происходит, если результат выполнения операции с переменной исходного типа неясен. Например, нельзя точно сказать, что получиться в результате сложения строки с числом, но операция сложения двух чисел очевидна, и в этом случае логично привести число к строке.

Преобразование строки к числу

Иногда сам программист может изменить тип переменной, применив к ней некоторые операции. Например, операции инкремента или декремента над строкой приведут её к числу.

var c = "not-a-number"; ++c; console.log(typeof c); // NaN

Стоит заметить, что не нужно прибегать к такому способу приведения строки к числу из-за его плохой читабельности и неочевидности. Для этой задачи в js существуют встроенные функции parseInt и parseFloat . В качестве первого аргумента они принимают строку, которую необходимо привести к числу, а в качестве второго необязательного – основание системы счисления, в которой записано число в строке, передаваемой в качестве первого аргумента. Если второй аргумент не указан, то будет считаться, что в строке записано число в десятичной системе счисления.

Функция parseInt используется для преобразования строки в целое число, а функция parseFloat для преобразования в дробное.

var a = parseInt("10"); console.log(["a = ", a, "; typeof a:", typeof a].join(" ")); // a = 10 ; typeof a: number var pi = parseInt("3.1415"); console.log("pi = " + pi); // pi = 3 pi = parseFloat("3.1415"); console.log("pi = " + pi); // pi = 3.1415

Обратите внимание, что в строке может находиться любое литеральное числовое значение, в том числе в шестнадцатеричном, восьмеричном или экспоненциальном виде.

a = parseInt("010"); console.log("a = " + a); // a = 8 a = parseInt("0xAA"); console.log("a = " + a); // a = 170 a = parseFloat("1e-10"); console.log("a = " + a); // a = 1e-10 (1e-10 = 1 * 10 ^ -10 = 0.0000000001)

В качестве второго параметра функций parseInt и parseFloat можно указать основание системы счисления.

a = parseInt("10", 8); console.log("a = " + a); // a = 8 a = parseInt("010", 10); console.log("a = " + a); // a = 10 a = parseInt("ff", 16); console.log("a = " + a); // a = 255

В случае если значение стоящие в строке, которую функции parseInt и parseFloat принимают в качестве первого параметра, не представляет собой числовой литерал, то результатом выполнения этих функций будет значение NaN .

a = parseInt("not a number"); console.log("a = " + a); // a = NaN a = parseFloat("not a number"); console.log("a = " + a); // a = NaN

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

В JavaScript значение любого типа можно привести к строке. Выше уже говорилось о том, что при конкатенации строки с числом, число приводится к строке, и лишь затем происходит конкатенация. Так будет происходить со значением любого типа.

var str = "Object: " + {}; console.log(str); // Object: str = "Array: " + ; console.log(str); // Array: 1,2,3 function sum(a, b) { return a + b; } str = "Function: " + sum; console.log(str); /* Function: function sum(a, b) { return a + b; } */

Фактически при приведении объекта к строке неявным образом вызывается метод toString , который так же можно вызвать явно.

var p = {x: 2, y: 4}, str; str = p.toString(); console.log(typeof str); // string console.log(str); // str = .toString(); console.log(typeof str); // string console.log(str); // 1,2,3

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

Преобразование в число происходит при выполнении математических операций и при выполнении операции сравнения с приведением типа (==, !=), при этом значение false и пустой массив преобразуются в значение 0 типа number .

var a = true + true + true; // 1 + 1 + 1 console.log(a); // 3

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

var arr = ; console.log(arr + 4); // 1,2,34 function sum(a, b){return a + b;} console.log(sum + 5); // function sum(a, b){return a + b;}5

Как видно, неявное преобразование типов в js далеко не всегда очевидно, поэтому стоит его избегать, используя функции для явного приведения типов, такие как parseInt , parseFloat и toString .

На этом всё. Как всегда, успехов вам!

Нет разницы в том, какого типа переменная используется в выражении. Если выражение математическое, все его переменные автоматически будут интерпретированы как числовые. Если обрабатываются строки, то все «участники» выражения рассматриваются как строки. Однако задача преобразования на JavaScript "строку в число" существует в значительно более широком контексте.

Методы JavaScript преобразования строк в числа

Арсенал методов для преобразования строк в числа не велик, но достаточен во всех простых случаях. Здесь JavaScript (для начинающих особенно) - это путь от от простому к сложному на практичных примерах.

В примере описаны четыре разных строки. В первом блоке вывода тип каждой переменных функция typeof определяется как string. Затем каждая строка очень просто преобразуется в число. Во втором блоке вывода видны изменения в переменных после преобразования, их тип стал числом. Пример преобразования JavaScript parseFloat особенно показателен: было "12e+3", стало "12000".

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

Обратное преобразование строки, «ставшей» числом, не всегда такая же строка. Этот момент можно использовать для проверки корректности ввода численной информации.

Обычные методы преобразования

Есть целые числа и есть дробные, соответственно, JavaScript строку в число преобразует по:

• parseInt;
• parseFloat.

Общий случай реализуется путем использования строки в простом математическом выражении.

Достаточно поставить перед строкой символов знак "+" и, если в ней есть число, то результатом выражения будет число. Значение переменной может измениться, но тип изменится всегда: typeof покажет number, а не string. Важно понимать, что использование преобразованной переменной в строчном выражении может показать совсем иной результат.

JavaScript для начинающих в этом контексте предельно прост. Сложнее понять работу целочисленного преобразования методом pasrseInt, поскольку автоматом он работает в десятичной системе счисления, но может интерпретировать строку как восьмеричную или шестнадцатеричную. При этом не всегда это обстоятельство зависит от второго параметра, который указывает на систему счисления.

JavaScript строку в число превратит всегда, но если в строке нет ни одного цифрового символа в начале строки, то результатом будет NaN.

Необходимо иметь представления о системах счисления, о способах записи шестнадцатеричных (число начинается с "0x") и восьмеричных чисел (число начинается с "0").

Для понимания нюансов работы метода JavaScript parseFloat достаточно иметь представление о том, что такое математическая запись вещественного числа.

Преобразование с целью сортировки

JavaScript - язык браузера, потому он более других языков критичен к символам за пределами основного набора латинского алфавита и цифр. Сортировка - востребованная операция. Но далеко не всегда имеет смысл пересылать данные на сервер для целей сортировки, проще и практичнее выполнить работу на месте, в браузере.

Для решения такой задачи можно преобразовать символы строки в их числовые коды или назначить буквам и цифрам упорядоченную последовательность цифр. Метод charCodeAt(), примененный к строке присвоит числовое значение 98 переменной iB, то есть коду буквы "b". Учитывая, что значение кода буквы "a" равно 97 можно получить номера всех букв латинского алфавита в порядке возрастания по строчным и прописным наборам. Аналогично по буквам русского алфавита.

Собственный вариант сортировки через числа позволяет сформировать нужные наборы символов. Можно, например, «переразместить» кириллицу и латиницу или их перемешать с целью оставить только отличные по написанию буквы, добавить в наборы символы табуляции и пробела.

Формирование уникального числа строки

Если код буквы "a" равен 97, то разница между буквой и числом 97 даст уникальный номер буквы в алфавите. Суммируя уникальные номера по каждому символу строки, трудно получить уникальное число этой строки.

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

• 0 вес 1;
• 1 вес 10;
• 2 вес 100;

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

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

«Растущие» селекторы страницы сайта

Часто возникает задача создания селекторов на страницах сайта, значения которых заранее указать нельзя, но с течением времени они дополняются. В самом первом применении пустой селектор доступен первому посетителю для ввода информации.

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

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

Для решения этой задачи метод JavaScript строку в число использовать нельзя. Обычные методы parseInt и parseFloat рассчитаны на иное применение, но можно придумать алгоритм однозначного преобразования строки в число, причем не обязательно обратимый. Достаточно того, что на разных наборах символов в строке алгоритм преобразования не будет повторяться.

Оптимизация трафика и аналитика

При формировании страницы разработчик использует значительные объемы информации. Предоставить посетителю возможность вводить информацию - хороший способ понизить рейтинг сайта вследствие его слабой функциональности и разочаровать посетителя.

Назначая на действия посетителя обработчик события в виде JavaScript function по определенным блокам информации, можно сформулировать фильтр, который позволит посетителю точно поставить цель, найти нужную информацию, получить желаемое решение.

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

Динамика множества чисел по всем посетителям в контексте точно известной информации позволяет другой JavaScript function (не обработчик), вызываемой по ответу сервера через механизм AJAX, оперативно в реальном масштабе времени давать всем посетителям нужную информацию одновременно. Так и работает система.

Такой вариант преобразования JavaScript строку в число очень востребован в разработке онлайн-игр, интерактивных конференций, передачи мгновенных сообщений и так далее.

Инструментальное применение преобразований

JavaScript и CSS в контексте обработки числовой информации позволяют управлять отображением страницы без участия сервера. Правила CSS построены как подстроки, рекурсивно. Обычно параметр - число, за которым следует несколько букв (например, "px", "pt", "em", ...). Параметр является подстрокой в правиле, а правило входит подстрокой в стиль класса или идентификатора.

Рекурсия JavaScript.Подстрока.Подстрока... выходит на нужное число, преобразует из строки в число, изменяет его и обратно записывает в нужное место. Правило меняется «автоматом». Это просто и удобно, никакого участия сервера.