Стать программистом. Часть 7. Основы JavaScript для абсолютных новичков!

Доброго времени суток, друзья!

В прошлом уроке мы продолжили рассматривать операции между переменными с одинаковыми типами. Мы научились проводить некоторые ассоциации для переменных с типами Boolean и Null, а также рассмотрели особенности взаимодействия переменных с типом Undefined. Надеюсь, основная часть информации, изложенной в предыдущих уроках была доступна для понимания. Напоминаю - при возникновении каких-либо вопросов, задавайте их в комментариях, и я постараюсь дать разъяснения еще раз, более подробно.

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

Давайте приступим!

Урок 7. Взаимодействие переменных с разными типами.

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

JavaScript является слабо типизируемым языком программирования. Что это значит? Для ответа на этот вопрос давайте вспомним Урок № 3, в котором мы учились создавать переменные и присваивать им значения.

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

Однако, есть такие языки программирования, которые при создании переменной требуют еще одно обязательное действие - указать какой именно тип переменной будет присвоен переменной с таким именем. Такие языки программирования называются строго типизируемыми.

В случае c JavaScript присвоение типа переменной происходит как бы за кулисами.
Например, мы написали:

var a;

JavaScript создал переменную с именем "a", а также незримо для нас дал ей тип "undefined".

Или второй вариант - мы написали:

var a = 2;

а затем подумали и переопределили эту переменную следующим образом:

a = 'привет, голосовчане!';

В этом случае JavaScript сначала создаст переменную "a" со значением "2" и незримо присвоит ей тип "Number (Число)", а затем переопределит ее значение на "привет, голосовчане!" и все также незримо изменит тип этой переменной на "String (Строка)".
Строго типизированный язык такого сделать бы не позволил. В рамках языков такого рода если уж Вы создали переменную с типом "Number (Число)", то присвоить ей значение с другим типом у Вас не выйдет.

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

Такое поведение для нас, как для программистов имеет свои плюсы и минусы.

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

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

Данная тема, так же, как и тема предыдущих двух уроков, обширна. Поэтому мы разделим ее на две составляющих:

1. Неявное приведение типов переменных при их взаимодействии друг с другом.
2. Явное приведение типов переменных при их взаимодействии друг с другом.

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

Неявное приведение типов переменных при их взаимодействии друг с другом.

За неявное приведение типов переменных отвечает JavaScript. Неявное - потому что происходит независимо от нас "за кулисами". А происходит оно тогда, когда взаимодействуют переменные разных типов.

Давайте рассмотрим это на примере для ясности. И начнем мы с взаимодействия переменных с типом "String (Строка)" и "Number (Число)".

Откроем наши index.html и core.js. И добавим код следующего вида в наш .js файл:

var a = 1 + 2;
var b = 1 + '2';

alert(a);
alert(b);

Пойдем в браузер, где открыт наш index.html, чтобы посмотреть, что выдадут нам наши сообщения.

Как мы можем видеть, первая арифметическая операция var a = 1 + 2;, как и ожидалось выдает результат "3". Зато вторая var b = 1 + '2'; выдает результат "12", а это мягко говоря не то, что можно было ожидать. В чем же тут дело? Давайте разбираться.

Первая запись тривиальна. в переменную "а" записывается результат сложения двух чисел "1" и "2". Оба аргумента числа, соответственно простая арифметическая операция - сложение... все понятно.

А что же такое произошло со второй записью? Если присмотреться, то станет понятно, что в переменную "b" мы пытаемся положить результат сложения не числа с числом, а числа 1 со строкой "2". Обратите внимание, что двойка в записи var b = 1 + '2'; взята в одинарные кавычки, а значит это строка. В ситуации, когда JavaScript видит, что ему необходимо сложить число и строку, он как раз и производит неявное приведение типа переменной.

То есть ничего нам не сообщая, JavaScript по-тихому меняет тип единицы с Number (Число) на String (Строку) и наша запись из var b = 1 + '2'; неявно преобразуется в запись var b = '1' + '2';, где строка '1' прибавляется к строке '2'. А мы знаем из урока 5, что происходит с двумя строками, когда их прибавляют - они склеиваются в одну. Именно поэтому мы и видим во втором сообщении браузера '12', вместо ожидаемого "3".

Из этого примера мы с Вами можем сделать следующий вывод:

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

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

Пример:

var a = 'у меня есть ';
var b = 6;
var c = ' голосов! А я хочу ';
var d = 7;

var f = a + b + c + d;

alert(f); 

Обновляем окно в браузере и видим:

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

А есть ли операции между переменными с типом "Number (Число)" и типом "String (Строка)", при которых преобразовываться будет не число в строку, а наоборот - строка в число? Да, есть. При всех остальных арифметических операциях JavaScript будет преобразовывать строку в число и выполнять стандартные вычисления.

Давайте проверим это на практике:

var a = '12';
var b = 6;
var c = '-10';
var d = 7;

var f = a - b;
var g = a / b;
var h = c * d;

alert(f);
alert(g);
alert(h);  

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

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

Оба этих правила имеют маленькую оговорку. Они работают только в тех случаях, когда JavaScript может преобразовать число в строку, а строку в число. Вернее, загвоздка именно со строкой. Потому что число JavaScript всегда может привести к типу String (Строка).

Смотрите:
У нас есть строка типа "13". JavaScript легко преобразует ее в число 13, если это потребуется. А вот строку вида "привет" JavaScript уже не сможет привести к типу Number (Число). И для такой строки, правила которые мы рассмотрели работать не будут. Для строк такого вида действуют другие правила, которые мы рассмотрим в следующем уроке.

Ссылки на предыдущие уроки:

1. Урок 1.
2. Урок 2.
3. Урок 3.
4. Урок 4.
5. Урок 5.
6. Урок 6.

Продолжение следует...