Типы данных в JavaScript

Определение типа данных

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

Далее, коротко рассмотрим все существующие типы данных в JavaScript.

Оператор typeof

Для того чтобы определить к какому типу данных относится то или иное значение, применяют оператор typeof единственным операндом, которого является идентификатор значения. Оператор typeof возвращает имя типа данных своего операнда.

typeof valueName

Простые типы данных

Числа

Число представляет собой последовательность цифр, которая находится в промежутке от 5e-324 (минимальное значение числа) до 1.7976931348623157e+308 (максимальное значение числа). Любое число меньшее чем 5e-324, автоматически преобразуется в число - 0 (нуль) (для отрицательных чисел в -0), а число большее чем 1.7976931348623157e+308 преобразуется в значение - Infinity (бесконечность) (для отрицательных чисел в -Infinity).

JavaScript не представляет отдельных типов данных для чисел (integer, float, double, long interger, ...), как например, это делают другие языки программирования (C++, Java). Все числа в Javascript представлены в виде одного единственного типа данных - number с размерностью 64 бит и всегда представляет из себя число с плавающей точкой (десятичная дробь).

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

Также значения числа может быть записано в экспоненциальной форме.

Далее даны несколько примеров чисел в JavaScript.

var year = 1993, // целое число
   price = 45.88, // десятичное число (с плавующей точкой)
  bigNum = 3e12, // число с экспонентой - 3000000000000
  hexNum = 0xff, // число в шестнадцатеричное системе счисления - 255
  octNum = 055;  // число в восьмеричной  системе счисления - 45

// Проверка типа данных каждой из переменных
typeof year;   // => number
typeof price;  // => number
typeof bigNum; // => number
typeof hexNum; // => number
typeof octNum; // => number

var year = 1993, // целое число

price = 45.88, // десятичное число (с плавующей точкой)

bigNum = 3e12, // число с экспонентой - 3000000000000

hexNum = 0xff, // число в шестнадцатеричное системе счисления - 255

octNum = 055; // число в восьмеричной системе счисления - 45

// Проверка типа данных каждой из переменных

typeof year; // => number

typeof price; // => number

typeof bigNum; // => number

typeof hexNum; // => number

typeof octNum; // => number

Строки

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

Для того чтобы использовать в строке слова, которые находятся в кавычках, нужно лишь использовать разные типы кавычек, например: '"Строки" в JavaScript', или экранировать их с помощью символа - \, например: "\"Строки\" в JavaScript".

Ниже представлено несколько примеров значений строкового типа.

var lang = "JavaScript",      // строка в двойных кавычках
    creator = 'Brendan Eich', // строка в одинарных кавычках
    standart = `ECMAScript`,  // строка в обратных кавычках
    htmlBlock = "<div id='htmlBlock'>text</div>"; // использование разных кавычек

// Проверка типа данных каждой из переменных
typeof lang;       // => string
typeof creator;    // => string
typeof standart;   // => string
typeof htmlBlock;  // => string

var lang = "JavaScript", // строка в двойных кавычках

creator = 'Brendan Eich', // строка в одинарных кавычках

standart = `ECMAScript`, // строка в обратных кавычках

htmlBlock = "<div id='htmlBlock'>text</div>"; // использование разных кавычек

// Проверка типа данных каждой из переменных

typeof lang; // => string

typeof creator; // => string

typeof standart; // => string

typeof htmlBlock; // => string

Логический тип данных

Данные логического типа могут принимать только два значения - true (истина) или false (ложь). Логический тип данных проще всего рассматривать как переключатель между двумя состояниями какой либо сущности, например из состояния включено в состояние выключено и наоборот. Логический тип данных часто используется при различных проверках значений.

// Проверяем является ли пользователь администратором системы
var isAdmin = true; // isAdmin содержит значение логического типа данных
if( isAdmin )
{
  createNewUser();
}

// Проверка типа данных
typeof isAdmin; // => boolean

// Проверяем является ли пользователь администратором системы

var isAdmin = true; // isAdmin содержит значение логического типа данных

if( isAdmin )

{

createNewUser();

}

// Проверка типа данных

typeof isAdmin; // => boolean

Null и Undefined

Null и Undefined - это типы данных, которые говорят об отсутствии каких-либо значений вовсе. Undefined в отличии от null говорит об отсутствии значений на более высоком уровне.

Значение undefiend автоматически присваивается любой не инициализированной переменной, несуществующему элементу массива или свойству объекта, а также при отсутствии параметра в функции, когда она ожидает его получить при вызове и, если функция не возвращает никакого значения, то она
возвращает undefined.

var age,                 // не инициализированная переменная
    numbers = [1,2],     // не инициализированный элемент под индексом 2
    bike = {year: 1994}; // не инициализированное свойство mark 
function sayHi(name){return "Hi " + name;}; // функция ожидает получить параметр name при вызове
function noReturn(){}; // функция ничего не возвращает (нет инструкции return)

age;        // => undefined
numbers[2]; // => undefined
bike.mark;  // => undefined
sayHi();    // => "Hi undefined"
noReturn(); // => undefined

var age, // не инициализированная переменная

numbers = [1,2], // не инициализированный элемент под индексом 2

bike = {year: 1994}; // не инициализированное свойство mark

function sayHi(name){return "Hi " + name;}; // функция ожидает получить параметр name при вызове

function noReturn(){}; // функция ничего не возвращает (нет инструкции return)

age; // => undefined

numbers[2]; // => undefined

bike.mark; // => undefined

sayHi(); // => "Hi undefined"

noReturn(); // => undefined

Значения null и undefined не могут быть преобразованы ни к каким другим типам данных. В виду этого они не могут пройти проверку на истинность значений только если они не равны сами себе.

undefined == false; // => false
undefined == true;  // => false

null == false; // => false
null == true;  // => false

undefined == null;  // => true
undefined === null; // => false

undefined == false; // => false

undefined == true; // => false

null == false; // => false

null == true; // => false

undefined == null; // => true

undefined === null; // => false

У null и undefined нет объектов-оберток, поэтому при вызове каких либо методов из этих значений Вы получите ошибку TypeError.

null.valueOf();      // => TypeError: Cannot read property 'valueOf' of null
undefined.valueOf(); // => TypeError: Cannot read property 'valueOf' of undefined

1 2	null.valueOf(); // => TypeError: Cannot read property 'valueOf' of null undefined.valueOf(); // => TypeError: Cannot read property 'valueOf' of undefined

Тот факт, что оператор typeof для типа null возвращает тип данных object, является известной всем ошибкой в языке JavaScript. С выпуском новых спецификаций ECMAScript эту ошибку нарочно не исправляют, просто потому, что ее исправление заденет все ныне созданные проекты на JavaScript, и приведет их к нерабочему состоянию. На текущий момент, остается лишь принимать эту ошибку как данность.

typeof null; // => object

1	typeof null; // => object

Простые типы данных в роли объектных

Для того чтобы вызывать объектные методы из значений простых данных, необходимо эти значения привести к объектному типу. Для этого, в момент вызова объектного метода, автоматически вызывается конструктор для соответствующего типа данных, например: для числа 45 будет вызван конструктор Number(), а для строки "example" будет вызван конструктор String().

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

// На момент вызова метода toUpperCase() c помощью конструктора String()
// создается объект-обёртка для строки "example"
// и после вычисления значения - "EXAMPLE", объект-обёртка уничтожается
// и возвращается вычисленное значение с типом данных - string
"example".toUpperCase(); // => "EXAMPLE"

// На момент вызова метода toUpperCase() c помощью конструктора String()

// создается объект-обёртка для строки "example"

// и после вычисления значения - "EXAMPLE", объект-обёртка уничтожается

// и возвращается вычисленное значение с типом данных - string

"example".toUpperCase(); // => "EXAMPLE"

Объектные типы данных

Массивы

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

Для объявления массива используют квадратные скобки - [], внутри которых, через запятую, перечисляются его элементы.

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

Каждый элемент массива имеет свой индекс (номер), по которому можно получить определенное значение. Индексация начинается с цифры - 0 (нуль).

// Инициализация массива fruits
var fruits = ["Манго", "Яблоко", "Апельсин", "Виноград"];
// Получение значений элементов массива по их индексу
 fruits[0]; // => "Манго"
 fruits[3]; // => "Виноград"
// Обращение к несуществующим элементам - вернет значение Undefined
 fruits[4]; // => Undefined

// Добавление элементов в массив
 fruits[4] = "Авокадо"; // добавляем пятый элемент массива
 fruits.push("Гранат"); // добавляем новый элемент в конец массива

// Переопределение элементов массива
 fruits[1] = "Вишня"; // Вместо значения "Яблоко" будет установлено значение "Вишня"

typeof fruits; // => object

// Инициализация массива fruits

var fruits = ["Манго", "Яблоко", "Апельсин", "Виноград"];

// Получение значений элементов массива по их индексу

fruits[0]; // => "Манго"

fruits[3]; // => "Виноград"

// Обращение к несуществующим элементам - вернет значение Undefined

fruits[4]; // => Undefined

// Добавление элементов в массив

fruits[4] = "Авокадо"; // добавляем пятый элемент массива

fruits.push("Гранат"); // добавляем новый элемент в конец массива

// Переопределение элементов массива

fruits[1] = "Вишня"; // Вместо значения "Яблоко" будет установлено значение "Вишня"

typeof fruits; // => object

Объекты

Объект в JavaScritpt представляет собой список пар имя/значение. В качестве объекта может выступать любая сущность имеющая какие-либо свойства с тем или иным значением. Для инициализации объекта используют фигурные скобки - {}, внутри которых описывают свойства и методы, а также присваивают им значения.

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

Свойства от значения отделяется знаком - :, каждое свойство объекта перечисляется через запятую.

Для получения значений свойств объекта - используют операторы доступа - . или [].

Для примера создадим объект описывающий сущность - "Мотоцикл".

// Инициализация объекта
var motocycle = {
  make: "Honda",
  model: "R1",
  year: 1995,
  showYear: function (){  // инициализация метода объекта
     return this.year;
  }
}

// Обращение к свойствам объекта
motocycle.make;       // => "Honda"; Получение значения через оператор - . (точка)
motocycle["model"];   // => "R1"; Получение значения через оператор - []
motocycle.showYear(); // => 1995; Получение возвращаемого значения метода 

typeof motocycle; // => object

// Инициализация объекта

var motocycle = {

make: "Honda",

model: "R1",

year: 1995,

showYear: function (){ // инициализация метода объекта

return this.year;

}

// Обращение к свойствам объекта

motocycle.make; // => "Honda"; Получение значения через оператор - . (точка)

motocycle["model"]; // => "R1"; Получение значения через оператор - []

motocycle.showYear(); // => 1995; Получение возвращаемого значения метода

typeof motocycle; // => object

Функции

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

Для инициализации функции необходимо использовать ключевое слово - function, определить набор аргументов внутри скобок - (), если они есть, и указать тело функции внутри фигурных скобок - {}.

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

// Инициализация функции 
var sum = function(a, b){
  result = a + b;
  return result;
}

// Вызов функции и присвоение возвращаемого значения переменной sumRes
var sumRes = sum(4, 5); // => 9

// Инициализация функции

var sum = function(a, b){

result = a + b;

return result;

}

// Вызов функции и присвоение возвращаемого значения переменной sumRes

var sumRes = sum(4, 5); // => 9

Регулярные выражения

Регулярное выражение - это набор символов помещенных между двумя косыми чертами - / /, которые представляют собой шаблон для поиска соответствий среди определенного текста.

// Создадим шаблон для поиска всех цифр в тексте
var text = "Александр Сергеевич Пушкин родился 26 мая 1799 года в Москве",
    template = /[0-9]\w+/g, // шаблон поисках всех цифр в тексте
    result = text.match(template); // => ["26", "1799"].

// Создадим шаблон для поиска всех цифр в тексте

var text = "Александр Сергеевич Пушкин родился 26 мая 1799 года в Москве",

template = /[0-9]\w+/g, // шаблон поисках всех цифр в тексте

result = text.match(template); // => ["26", "1799"].

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

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

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

Преобразование с помощью конструкторов.

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

Существует 4 конструктора для преобразования типов данных.

Number() - преобразование к числовому типу
String() - преобразование к строковому типу
Boolean() - преобразование к Булевому типу
RegExp() - преобразование к объектному типу "Регулярное выражение"

// Преобразования к числовому типу
Number("45"); // => 45. Строка->Число 
Number(true); // => 1. Булево значение->Число

// Преобразования к строковому типу
String(45);   // => "45". Число->Строка
String(true); // => "true". Булево значение->Строка

// Преобразования к Булевому типу
Boolean(45);      // => true. Число->Булево значение
Bolean("Hello!"); // => true. Строка->Булево значение

// Преобразования к объектному типу "Регулярное выражение"
RegExp("\w"); // => /\w/. Строка->Регулярное выражение

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

Number("45"); // => 45. Строка->Число

Number(true); // => 1. Булево значение->Число

// Преобразования к строковому типу

String(45); // => "45". Число->Строка

String(true); // => "true". Булево значение->Строка

// Преобразования к Булевому типу

Boolean(45); // => true. Число->Булево значение

Bolean("Hello!"); // => true. Строка->Булево значение

// Преобразования к объектному типу "Регулярное выражение"

RegExp("\w"); // => /\w/. Строка->Регулярное выражение

Важно обратить внимание, что вызов конструктора без оператора new - не переводит простой тип данных в объект явным образом в чем можно убедиться вызвав оператор typedef.

typeof Number("45");     // => "number"
typeof new Number("45"); // => "object"

1 2	typeof Number("45"); // => "number" typeof new Number("45"); // => "object"

Преобразование с помощью глобальных функций

Преобразование простых типов (кроме null и undefined) к числам и строкам также возможно с использованием глобальных функций.

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

// Преобразования к числовому типу
// Все символы идущие после числа в строке игнорируются
parseInt("45.4 px");   // => 45. Строка->Целое число. 
parseFloat("45.4 px"); // => 45.4. Строка->Десятичное число.

// Преобразования к строковому типу 
var num = 45,
truth = true;
num.toString();   // => "45". Число->Строка
truth.toString(); // => "true". Булево значение->Строка

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

// Все символы идущие после числа в строке игнорируются

parseInt("45.4 px"); // => 45. Строка->Целое число.

parseFloat("45.4 px"); // => 45.4. Строка->Десятичное число.

// Преобразования к строковому типу

var num = 45,

truth = true;

num.toString(); // => "45". Число->Строка

truth.toString(); // => "true". Булево значение->Строка

Преобразование с помощью унарных операторов

Некоторые унарные операторы такие как +, !, а также сложение с пустой строкой - "", можно использовать для преобразования типов данных.

// Унарный оператор - + (плюс)
var year = +"1994", // => 1994. Строка->Число

// Сложение с пустой строкой
price = 45 + "", // => "45". Число->Строка

// Двойное отрицание позволяет привести значение к Булевому типу
truth = !!"Hi there!"; // => true. Строка->Булево значение

// Унарный оператор - + (плюс)

var year = +"1994", // => 1994. Строка->Число

// Сложение с пустой строкой

price = 45 + "", // => "45". Число->Строка

// Двойное отрицание позволяет привести значение к Булевому типу

truth = !!"Hi there!"; // => true. Строка->Булево значение

Переменные и константы в JavaScript

Строки в JavaScript