Восемь типов данных, typeof
Материал на этой странице устарел, поэтому скрыт из оглавления сайта.
Более новая информация по этой теме находится на странице https://learn.javascript.ru/types.
В JavaScript существует несколько основных типов данных.
В этой главе мы получим о них общее представление, а позже, в соответствующих главах подробно познакомимся с использованием каждого типа в отдельности.
Число «number»
Единый тип число используется как для целых, так и для дробных чисел.
Существуют специальные числовые значения Infinity (бесконечность) и NaN (ошибка вычислений).
Например, бесконечность Infinity получается при делении на ноль:
Ошибка вычислений NaN будет результатом некорректной математической операции, например:
Эти значения формально принадлежат типу «число», хотя, конечно, числами в их обычном понимании не являются.
Особенности работы с числами в JavaScript разобраны в главе Числа.
Число «bigint»
В JavaScript тип «number» не может содержать числа больше, чем 2 53 (или меньше, чем -2 53 для отрицательных). Это техническое ограничение вызвано их внутренним представлением. 2 53 – это достаточно большое число, состоящее из 16 цифр, поэтому чаще всего проблем не возникает. Но иногда нам нужны действительно гигантские числа, например в криптографии или при использовании метки времени («timestamp») с микросекундами.
Тип BigInt был добавлен в JavaScript, чтобы дать возможность работать с целыми числами произвольной длины.
Чтобы создать значение типа BigInt , необходимо добавить n в конец числового литерала:
Более подробно тип данных BigInt мы рассмотрим в отдельной главе BigInt.
Строка «string»
В JavaScript одинарные и двойные кавычки равноправны. Можно использовать или те или другие.
В некоторых языках программирования есть специальный тип данных для одного символа. Например, в языке С это char . В JavaScript есть только тип «строка» string . Что, надо сказать, вполне удобно.
Более подробно со строками мы познакомимся в главе Строки.
Булевый (логический) тип «boolean»
У него всего два значения: true (истина) и false (ложь).
Как правило, такой тип используется для хранения значения типа да/нет, например:
О нём мы поговорим более подробно, когда будем обсуждать логические вычисления и условные операторы.
Специальное значение «null»
Значение null не относится ни к одному из типов выше, а образует свой отдельный тип, состоящий из единственного значения null :
В JavaScript null не является «ссылкой на несуществующий объект» или «нулевым указателем», как в некоторых других языках. Это просто специальное значение, которое имеет смысл «ничего» или «значение неизвестно».
В частности, код выше говорит о том, что возраст age неизвестен.
Специальное значение «undefined»
Значение undefined , как и null , образует свой собственный тип, состоящий из одного этого значения. Оно имеет смысл «значение не присвоено».
Если переменная объявлена, но в неё ничего не записано, то её значение как раз и есть undefined :
Особенности типов данных и преобразования в JavaScript
На первый взгляд тема типов данных и преобразований может показаться легкой.
Обычно она изучается в самом начале погружения в JavaScript. Однако в этих темах есть неочевидные подводные камни, которые знает далеко не каждый разработчик.
В этой статье мы рассмотрим особенности типов данных и преобразований, которые многие пропустили.
typeof
JavaScript имеет 8 встроенных типов данных:
Подробности о каждом типе данных вы можете причитать в любой документации.
Значения typeof отличаются:
Оператор typeof возвращает строку, указывающую тип операнда.
Операнд – то, к чему применяется оператор. Например, в умножении 5 * 2 есть два операнда: левый операнд равен 5 , а правый операнд равен 2 .
Оператор typeof напрямую не коррелирует со встроенными типами!
typeof null
Давайте рассмотрим пример:
В консоль будет выведено значение true .
Такой результат будет из-за того, что JavaScript имеет старый баг.
typeof null возвращает «object» .
Этот баг существует уже много лет и вероятнее всего уже никогда не будет исправлен. Это связано с тем, что написано слишком много кода, который полагается на это ошибочное поведение.
typeof function
Что будет выведено в консоль?
У многих людей, которые не встречали такого вопроса ранее, может возникнуть недоумение. Учитывая, что typeof y и typeof x возвращает “function” , кто-то может ожидать, что функция является одним из встроенных типов в JS. На самом деле, согласно спецификации, функция — это подтип объекта. Благодаря этому можно проверить количество аргументов у функции через .length
typeof NaN
Важно запомнить особенности NaN :
NaN никогда не равен сам себе независимо от того используем мы == или === .
typeof NaN всегда возвращает “number” . Это может показаться странным из-за того, что NaN — не число, которое является числом. NaN все еще числовой тип несмотря на этот факт.
window.isNaN вернет true только для фактических значений NaN , когда результат просто не число.
window.isNaN преобразует аргумент в number и возвращает true , если результат будет равен NaN
Number.isNaN был добавлен в ES6. Number.isNaN вернет true только для тех значений, которые не являются числами, например, применимо к строке, будет возвращено false .
Number.isNaN производит приведение типов, в то время как window.isNaN не делает приведение.
Значение vs Ссылка
Вспомним простые значения в JS:
Простые значения в JS имутабельные. Комплексные значения мутабельные.
Сначала повторим разницу между мутабельными и имутабельными данными.
В примере мутабельности мы определили массив x . Константе y мы присвоили ссылку на х . Когда мы модифицируем массив x , мы также модифицируем и y .
При работе с имутабельными данными такого эффекта не происходит. Это важно запомнить!
Мы рассмотрели пример с числами. Давайте взглянем на пример со строками:
В данном примере не произойдет изменение строки!
Если вы хотите изменить строку, то вам придется создать новую переменную.
С использованием метода .toUpperCase() ситуация будет отличаться.
Метод .toUpperCase() возвращает новую строку и присваивает переменной a .
Взглянем, как ведут себя массивы со строками:
Тут мы получили модифицированный массив b .
После повторения разницы между мутабельными и имутабельными данными может возникнуть вопрос: “Откуда у примитивных данных есть полезные методы вроде .toUpperCase() ?”
Если движок JavaScript встречает запись подобную «hello».toUpperCase() и у нас есть примитив, то мы вызываем у него метод. В таком случае вокруг примитива создается обертка в виде объекта, у которого как раз есть методы. После выполнения инструкции обертка удаляется и у нас снова остается примитивное значение.
Давайте рассмотрим легкий пример:
После повторения теории результат выполнения будет очевидным.
Но существует особенность в другом похожем примере:
Переменной a мы присвоили массив.
Переменной b мы присвоили ссылку на переменную а , а затем переменной b присвоили новый массив.
В момент последнего присвоения старая ссылка была удалена!
Если мы создали новую ссылку в b , то мы уже не можем, модифицируя b , изменять и a .
Сравнение типов
Преобразование может быть явным, когда мы целенаправленно приводим один тип к другому, либо неявным, когда приведение типа происходит автоматически без явных команд.
В JavaScript преобразование всегда приводит к 3м типам:
к логическому значению ( true / false )
Приведение к строке
В данном примере преобразование происходит очевидным образом.
Приведение к числу
Тут есть исключения, которые нужно помнить:
Number(null) приводится к 0
Number(undefined) приводится к NaN
Пустой массив Number([]) приводится к 0
Не пустой массив Number([1, 2, 3]) приводится к NaN
Приведение к логическому типу
В этом примере стоит заострить внимание на объектах и массивах.
Пустая функция, объект или массив приведет к true .
Приведение комплексных данных
Комплексные данные, такие как объекты и массивы, сначала будут преобразованы в их примитивные значения, а уже потом это значение будет преобразовано в число.
Разберем более подробно. Если у объекта доступен метод .valueOf , который возвращает примитивное значение, то оно будет использоваться для приведения к числу, а если нет, то будет использоваться метод .toString() .
Если ни одна операция не может предоставить примитивное значение, то выдается ошибка “Type Error”
Давайте коснемся логических операторов прежде чем продолжить дальше:
Как вы думаете что будет выведено в консоль?
Казалось бы простой вопрос, но не все ответят правильно.
В консоль будет выведено с . Особенно для тех, кто пришел из других языков такой результат будет неочевиден.
Вспомним как работают логические операторы:
Если оба операнда истины, тогда будет возвращен последний операнд.
Строгое сравнение и сравнение с приведением типов
Обычно считается, что === использует “строгое” сравнение, и сравнивает типы, а == нет.
Если говорить более корректно, == позволяет делать приведение типов, тогда как === не разрешает.
Таблицы ниже показывают в результатах между == и ===
Неявное приведение между строкой и числом
Можно неявно привести строку к числу, используя оператор + .
В JS оператор + используется как для сложения чисел, так и для конкатенации строк.
Оператор + выполняет операцию .toPrimitive над значением левой и правой стороны.
Метод .toPrimitive вызывает valueOf у значения. Если одно из значений является строкой, то он их объединяет.
Также существует небольшая разница между неявным приведением числа к строке с помощью + и явным с помощью String() .
+ вызывает valueOf , в то время как явный метод вызывает toString
Искусственный пример. Не берите его в свой код. Пример только для наглядности:
Алгоритмы сравнения
Нас интересует, что происходит, когда boolean находится по обе стороны от == .
Вы могли ожидать, что «22» == true вернет true , т.к. “22” является истинным значением, но фактически результат будет false .
Это происходит из-за того, что значение true приводится к числу. Результат выполнения будет 1 . Далее «22» приводится к числу 22 . В конце идет сравнение 22 == 1 , где и возвращается false .
Задачи на собеседованиях
Мы готовы рассмотреть интересные примеры, которые встречаются на собеседованиях.
Более сложные примеры
Операнд — то к чему применяется оператор.
Бинарный оператор — оператор, который применяется к 2м операндам ( 1 + 3 )
Унарный оператор — оператор, который применяется к одному операнду ( 2++ )
Пользуясь возможность возможностью хотелось бы рассказать о youtube канале Open JS на котором выкладываются обучающие ролики по JavaScript. Ни какой воды, рекламы и пустых рассуждений. Канал только начал свое развитие. Буду рад поддержке!
The typeof javaScript operator and other data type related things
The javaScript typeof operator will return a string that is the type of the operand that is given to it from the right of the typeof keyword when used in an expression. It is the first go to operator then to go about preforming type checking of values in javaScript.
However when it comes to data type checking in javaScript there are also some additional things to look out for when it comes to really knowing what one is dealing with when it comes to values. For example when it comes to objects the typeof operator will always return object, but will not give insight into the type of object. So the typeof operator is not a replacement for other keywords such as the instance of operator that will help to know what kind of object a value is when it is in fact an object.
The typeof operator might not always give the desired results in many cases. Maybe the most note worthy issue to be aware of is that it will return the value ‘object’ when used with a null value. This is actually the value that it should return, but some developers might considered this a bit confusion, and in any case it is something that one has to adjust for no matter what anyway.
1 — javaScript typeof lowdown
The typeof operator has right to left associativity so to use it I just need to type the typeof operator followed by what it is that I want to find the type of. the result of the expression of the typeof operator with the value I want the type of to the right of typeof will then evaluate to a string, and the string more often then not will be the type of the value. For the most part the typeof operator is fairly straight forward to use but it has a few quirks, so lets get into it by starting off with a basic example of javaScript typeof.
Here the javaScript typeof operator works as expected, I give it a number and it returns the string ‘number’. So far the type of operator works the way it should without issue. However there are certain values like NaN that stands for Not a Number yet its type if number. Things also get a little weird when I pass it the null value for example so lets continue looking at some more examples here.
2 — No need to call typeof as it is an operator and not a function
In some examples I see new javaScript developers placing parentheses around what it is that they want to find the type of. This is not necessary as the typeof operator is an operator and not a function. However in some cases you might still want to use parentheses as a way to group an expression as you might get undesired results.
So if you do need to group then use parentheses otherwise they are not needed.
3 — The deal with javaScript typeof and null
So there is something strange with the typeof operator and the value of null. When the value of null is what is used with the typeof operator the result is object.
From what I have gathered so far with the typeof null equals object deal in javaScript it it would seem that this is a mistake that dates all the way to the beginning of javaScript. However maybe object is an appropriate value to return considering that the value is often used as a placeholder for what should be an object. There is some talk as to the subject of if it will be fixed or not but so far it seems like that is not happening. Also it would not be a good idea to change it at this point as that would result in a whole world of code breaking, so it would seem that this is just once little thing that javaScript developers just need to adjust for when using typeof.
4 — The Instanceof operator is what can be used for finding out what kind of object I am dealing with
In most cases the typeof operator works just fine if I want to find out if something is a number, string, or an object. However if I want to find out what kind of object I am dealing with then in most cases typeof does not help much unless it the object is a function. When it comes to javaScript there are plain old objects that are cerated with the Object constructor, or the object literal syntax, but there is also a whole worlds of different kinds of objects created with a constructor function.
There are a number of built in constructor functions like Date, and Function, but it is also possible to create ones own Constructor functions also. So it is a good idea to know how to go about finding out what kind of object one is dealing with when type checking, there are a few ways to do this, but maybe the instanceof operator is the first and foremost option that will come up.
The instanceof operator accepts two operands one to the left that is what should be an object, and the other is a constructor function. If the variable or value that is being evaluated is an instance of the constructor then the expression will evaluate to true, else false.
5 — Constructor name
When dealing with an object another way to get the actual constructor name of the object rather than just always getting object is to look at the constructor property. All objects should have a constructor object that will contain the constructor function that was used to create the object. For example if it is a Date object then the constructor should be the Date constructor. There is then a name property of this object that is then the name of that constructor function that was used.
6 — Conclusion
So it would seem that the javaScript typeof operator can be used as a way to find out the type of something in javaScript, but it might not aways work as expected. In addition when it comes to objects it is vague and can even return a value of object for null, so it still needs to be used with other operators to find out more in these situations.
JavaScript might be a typeless language however that just means that a variable can be any type at any given moment, it does not meed that javaScript does not have types. There are a number of data types to be aware of, also the javaScript of today is not the javaScript of yesterday as new specs of javaScript keep coming out additional types are being added. One note worthy example of this might be the Big integer data type that has been introduced in recent years.
JavaScript typeof
In JavaScript there are 5 different data types that can contain values:
- string
- number
- boolean
- object
- function
There are 6 types of objects:
- Object
- Date
- Array
- String
- Number
- Boolean
And 2 data types that cannot contain values:
- null
- undefined
The typeof Operator
You can use the typeof operator to find the data type of a JavaScript variable.
Example
- The data type of NaN is number
- The data type of an array is object
- The data type of a date is object
- The data type of null is object
- The data type of an undefined variable is undefined *
- The data type of a variable that has not been assigned a value is also undefined *
You cannot use typeof to determine if a JavaScript object is an array (or a date).
Primitive Data
A primitive data value is a single simple data value with no additional properties and methods.
The typeof operator can return one of these primitive types:
- string
- number
- boolean
- undefined
Example
Complex Data
The typeof operator can return one of two complex types:
- function
- object
The typeof operator returns "object" for objects, arrays, and null.
The typeof operator does not return "object" for functions.
Example
The typeof operator returns " object " for arrays because in JavaScript arrays are objects.
The Data Type of typeof
The typeof operator is not a variable. It is an operator. Operators ( + — * / ) do not have any data type.
But, the typeof operator always returns a string (containing the type of the operand).
The constructor Property
The constructor property returns the constructor function for all JavaScript variables.
Example
You can check the constructor property to find out if an object is an Array (contains the word "Array"):
Example
Or even simpler, you can check if the object is an Array function:
Example
You can check the constructor property to find out if an object is a Date (contains the word "Date"):
Example
Or even simpler, you can check if the object is a Date function:
Example
Undefined
In JavaScript, a variable without a value, has the value undefined . The type is also undefined .
Example
Any variable can be emptied, by setting the value to undefined . The type will also be undefined .
Example
Empty Values
An empty value has nothing to do with undefined .
An empty string has both a legal value and a type.
Example
In JavaScript null is "nothing". It is supposed to be something that doesn’t exist.
Unfortunately, in JavaScript, the data type of null is an object.
You can consider it a bug in JavaScript that typeof null is an object. It should be null .
You can empty an object by setting it to null :
Example
You can also empty an object by setting it to undefined :
Example
Difference Between Undefined and Null
undefined and null are equal in value but different in type:
typeof undefined // undefined
typeof null // object
null === undefined // false
null == undefined // true
The instanceof Operator
The instanceof operator returns true if an object is an instance of the specified object:
Example
(cars instanceof Array);
(cars instanceof Object);
(cars instanceof String);
(cars instanceof Number);
The void Operator
The void operator evaluates an expression and returns undefined. This operator is often used to obtain the undefined primitive value, using "void(0)" (useful when evaluating an expression without using the return value).