Приведение типов. Оператор +

Приведение типов в JavaScript вполне может удивить своим результатом, если не знать его нюансы.

Давайте немного рассмотрим эту тему на примере оператора +.
Операторы могут быть как унарными так и бинарными. Унарный оператор — это тот, который применяется к одному операнду, а бинарный применяется к двум.
Так и оператор плюс бывает унарным и бинарным.

Унарный оператор

Как вы думаете, что выведет следующая строка?

 
+'hi'

Результатом будет NaN — Not-A-Number (не число), так как строку к числу привести нельзя, а унарный оператор плюс как раз и занимается приведением к числу.

Что ж, рассмотрим другой случай:

 
+'5'

Тут мы получим число 5.
А если так?

 
+'5 coins'

И снова с нами NaN.
А как дела обстоят с логическими значениями?

 
+true
//1
+false
//0

Приведение к числу true вернет 1, а false 0. Уж тут-то запомнить не сложно!
Рассмотрим следующий тип данных — null.

 
+null
//0

И в данном случае запомнить легко — мы получим 0.

И наконец undefined:

 
+undefined
//NaN

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

А что если в строке помимо цифр присутствуют пробелы?

 
+" \n 777 \n \n";
//777

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

 
+" \n 77 \n 7 \n \n"
//NaN

Применение

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

 
var cats = '5';
var dogs = 2;
cats + dogs
//25

Но если на помощь приходит унарный +, то проблема решается:

 
+cats + +dogs;
//7

Бинарный оператор +

Обычно бинарный оператор + используют для сложения чисел, но если хотя бы один из операндов строка, то произойдет приведение к строке обоих операндов.
Рассмотрим пример:

 
'мои' + 17
//'мои 17'

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

 
true + false
//1
true + true
//2

Сложение объектов

Очень интересно рассматривать сложение объектов. Хотя для этого желательно понимать как происходит преобразование объектов в примитивы.
Например:

 
{}+{}
//NaN

Как упоминалось в посте про синтаксис JavaScript, предложения-выражения не должны начинаться с фигурных скобок, поэтому первые скобки игнорируются, а +{} преобразует сначала объект в примитив – «[object Object]”, а потом Number(«[object Object]”) приводит к NaN.
Number — это объект-обертка, действует как унарный +.

Что ж, давайте дадим понять, что у нас выражение:

 
({}+{})
//"[object Object][object Object]"

В этот раз оба объекта преобразуются в примитивы — строки и произойдет их сложение.
В js есть такая разновидность объекта, как массив. Вы знаете в какой примитив преобразуется он?

 
[]+{}
//"[object Object]"

Он преобразуется в пустую строку. Почему это происходит — я расскажу в одном из следующих постов.
А также можете решить задачку про сложение массивов.

Кстати, а если бы это был не пустой массив, то чтобы содержала строка? Проверьте!
Второй операнд — объект, как и в прошлый раз преобразуется в «[object Object]». Сложение строк дает нам «[object Object]».
В общем, вы поняли, что с помощью оператора + сложить два массива и получить новый, состоящий из предыдущих, нельзя 🙂

На этом я на сегодня закончу. Но это лишь некоторые случаи преобразования.