flexbe banner 468x60flexbe banner 728x90flexbe banner 930x180kwork banner 468x60kwork banner 728x90kwork banner 930x180smsc banner 468x60smsc banner 728x90smsc banner 930x180

Руководство по преобразованию типа данных в JavaScript

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

alert("3" - 2);  // Выводит: 1 
alert("3" + 2);  // Выводит: "32" (потому что + также оператор конкатенации)
alert(3 + "2");  // Выводит: "32"
alert("3" * "2");  // Выводит: 6
alert("10" / "2");  // Выводит: 5
alert(1 + true);  // Выводит: 2 (потому что true преобразуется в 1)
alert(1 + false);  // Выводит: 1 (потому что false преобразуется в 0)
alert(1 + undefined);  // Выводит: NaN
alert(3 + null);  // Выводит: 3 (потому что null преобразуется в 0)
alert("3" + null);  // Выводит: "3null"
alert(true + null);  // Выводит: 1
alert(true + undefined);  // Выводит: NaN

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

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

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

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

var str = "123";
alert(typeof str); // Outputs: string

var num = Number(str); // Becomes a number 123
alert(typeof num); // Outputs: number

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

Number("10.5")  // Возвращает 10.5
Number(true)  // Возвращает 1
Number(false)  // Возвращает 0
Number(null)  // Возвращает 0
Number(" 123 ")  // Возвращает 123
Number(" ")  // Возвращает 0
Number("")  // Возвращает 0
Number("123e-1")  // Возвращает 12.3
Number("0xFF") // Возвращает 255 (шестнадцатеричное представление)
Number("undefined")  // Возвращает NaN
Number("null")  // Возвращает NaN
Number("Hello World!")  // Возвращает NaN

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

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

В следующем примере показано, как преобразовать логическое значение в строку.

var bool = true;
alert(typeof bool); // Выводит: boolean

var str = String(bool); // Становится строкой "true"
alert(typeof str); // Выводит: string

Метод String() может использоваться с любыми типами чисел, переменных или выражений:

String(10.5)  // Возвращает "10.5"
String(123)  // Возвращает "123"
String(100 + 23)  // Возвращает "123"
String(true)  // Возвращает "true"
String(false)  // Возвращает "false"
String(123e-1)  // Возвращает "12.3"
String(0xFF) // Возвращает "255"
String(undefined)  // Возвращает "undefined"
String(null)  // Возвращает "null"

Другой метод преобразования чисел в строки — использование метода toString():

var num = 123;
alert(typeof num); // Выводит: number

var str = num.toString(); // Становится строкой "123"
alert(typeof str); // Выводит: string

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

Булевы преобразования также довольно просты. Вы можете использовать метод Boolean() для преобразования любого значения в логическое значение (т. е. true или false).

Значения, которые являются интуитивно пустыми, например 0, null, false, undefined, NaN или пустая строка (""), становятся false. Другие значения становятся true, как показано в примере здесь:

Boolean(0) // Возвращает false
Boolean(null)  // Возвращает false
Boolean(false)  // Возвращает false
Boolean(undefined)  // Возвращает false
Boolean(NaN)  // Возвращает false
Boolean("") // Возвращает false
Boolean("0") // Возвращает true
Boolean(1) // Возвращает true
Boolean(true) // Возвращает true
Boolean("false") // Возвращает true
Boolean("Hello World!") // Возвращает true
Boolean(" ") // Возвращает true

Если вы внимательно посмотрите пример, вы обнаружите, что метод Boolean() возвращает true для строки с нулем «0» и строку «false», тогда как он возвращает false для значений 0 и false.

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

Преобразование объекта в примитивное значение

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

JavaScript автоматически выполняет преобразование объекта в строку, когда мы пытаемся распечатать такой объект, как alert(obj) или document.write(obj). Аналогично, преобразования объекта в число автоматически выполняются, когда мы пытаемся добавить или вычесть объекты или применить математические функции, например, добавить или вычесть объекты даты. Вот пример:

var date1 = new Date(2018, 5, 24);
alert(date1); // Отображает строку даты как: Sun Jun 24 2018 00:00:00

var date2 = new Date(2025, 8, 15);
var time = date2 - date1;
alert(time) // Отображает строку в миллисекундах: 228096000000

Вы также можете выполнить преобразование объекта в строку вручную, используя метод toString(), который возвращает строковое представление объекта. Кроме того, вы можете использовать метод valueOf() для некоторых объектов, таких как Date, для выполнения преобразования объекта в число. Вот пример:

var arr = [1, 2, 3];
arr.toString(); // Возвращает "1,2,3"

var d = new Date(2018, 5, 24);
d.toDateString(); // Возвращает дату Sun Jun 24 2018 00:00:00
d.valueOf(); // Возвращает 1529778600000

Преобразование объекта в логическое значение не имеет смысла, поскольку все объекты (включая массивы и функции) являются истинными в логическом контексте. Так что есть только строковые и числовые преобразования.

Преобразование типов с использованием операторов

Некоторые операторы JavaScript, такие как операторы + и - также могут использоваться для преобразования типов, как показано в следующем примере:

var x = "10"; // x это стока
var y = +x;
alert(typeof(y)); // Выводит: number
alert(y); // Выводит: 10

var x = 10; // x это число
var y = x + "";
alert(typeof(y)); // Выводит: string
alert(y); // Выводит: 10

var x = "15"; // x это стока
var y = x - 0;
alert(typeof(y)); // Выводит: number
alert(y); // Выводит: 15

var x = "123";
alert(typeof(!!x)); // Выводит: boolean
alert(!!x); // Выводит: true

var x = "Hello World!";
var y = +x;
alert(typeof(y));// Выводит: number
alert(y); // Выводит: NaN

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

kwork banner 480x320kwork banner 728x90kwork banner 120x600smsc banner 480x320smsc banner 728x90smsc banner 120x600skillbox banner 480x320skillbox banner 728x90skillbox banner 120x600

Насколько публикация полезна?

Нажмите на звезду, чтобы оценить!

Средняя оценка 5 / 5. Количество оценок: 1

Оценок пока нет. Поставьте оценку первым.

Похожие посты

Руководство по сортировке массивов в JavaScript

Сортировка — обычная задача при работе с массивами. Она будет использоваться, например, если вы захотите отобразить названия городов или регионов в алфавитном порядке. JavaScript массив (array) имеет встроенный метод sort() для сортировки элементов массива в алфавитном порядке. Следующий пример демонстрирует, как это работает: Реверсирование массива Вы можете использовать метод reverse(), чтобы изменить порядок элементов массива…
Подробнее

Руководство по массивам в JavaScript

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

Руководство по работе с атрибутами DOM в JavaScript

Атрибуты — это специальные слова, используемые внутри начального тега HTML-элемента для управления поведением тега или предоставления дополнительной информации о теге. JavaScript предоставляет несколько методов для добавления, удаления или изменения атрибутов HTML-элемента. В этом разделе мы узнаем об этих методах подробно. Получение значения атрибута элемента Метод getAttribute() используется для получения текущего значения атрибута элемента. Если указанный…
Подробнее