Переменные и типы данных

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

Если это электронный магазин - то это товары, корзина. Если чат - посетители, сообщения и так далее.

Чтобы хранить информацию, используются переменные.

Переменная

Переменная состоит из имени и выделенной области памяти, которая ему соответствует.

Для объявления или, другими словами, создания переменной используется ключевое слово var:

var message;

После объявления, можно записать в переменную данные:

var message;
message = 'Привет'; // сохраним в переменной строку

Эти данные будут сохранены в соответствующей области памяти и в дальнейшем доступны при обращении по имени:

var message;
message = 'Привет'; 

alert(message); // выведет содержимое переменной

Для краткости можно совместить объявление переменной и запись данных:

var message = 'Привет';

Аналогия из жизни

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

Например, переменная message - это коробка, в которой хранится значение "Привет":

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

var message;

message = 'Привет'; 

message = 'Мир';    // заменили значение

alert(message);

При изменении значения старое содержимое переменной удаляется.

Существуют функциональные языки программирования, в которых значение переменной менять нельзя.

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

С виду - не очень удобно, но, как ни странно, и на таких языках вполне можно успешно программировать. Изучение какого-нибудь функционального языка рекомендуется для расширения кругозора. Отличный кандидат для этого — язык Erlang .

Копирование значений

Переменные в JavaScript могут хранить не только строки, но и другие данные, например, числа.

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

var num = 100500;
var message = 'Привет';

Значение можно копировать из одной переменной в другую.

var num = 100500;
var message = 'Привет';

*!*
message = num;
*/!*

Значение из num перезаписывает текущее в message.

В «коробке» message меняется значение:

После этого присваивания в обеих коробках num и message находится одно и то же значение 100500.

Важность директивы `var`

В JavaScript вы можете создать переменную и без var, достаточно просто присвоить ей значение:

x = "value"; // переменная создана, если ее не было

Технически, это не вызовет ошибки, но делать так все-таки не стоит.

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

Откройте пример в IE в новом окне:

<html>
<head>
  <meta http-equiv="X-UA-Compatible" content="IE=8">
</head>
<body>
  <div id="test"></div>

  <script>
    test = 5;
    alert(test);
  </script>

</body>
</html>

Показать в отдельном окне

Значение не выведется, будет ошибка. Если в IE включена отладка или открыта панель разработки - вы увидите ее.

Дело в том, что почти все современные браузеры (включая IE, Safari/Chrome и Opera, но кроме Firefox) создают переменные для элементов, у которых есть id.

Переменная test в них в любом случае существует, запустите, к примеру не в Firefox:

<div id="test"></div>

<script> 
  alert(test); // выведет тип элемента
</script>

..Но в IE<9 такая переменная не может быть изменена, именно поэтому код в примере дает ошибку JavaScript.

Причем, что самое забавное, эта ошибка будет только в IE<9, и только если на странице присутствует элемент с совпадающим id. Такие ошибки особенно весело исправлять и отлаживать.

.. А для того, чтобы все было хорошо - достаточно использовать var:
Правильный код:

<html>
<body>
  <div id="test"></div>

  <script>
    *!*var*/!* test = 5;
    alert(test);
  </script>

</body>
</html>

Есть и еще ситуации, когда отсутствие var может привести к ошибкам. Надеюсь, я вас убедил.

Объявите две переменные: admin и name.
Запишите в name строку "Василий".
Скопируйте значение из name в admin.
Выведите admin (должно вывести «Василий»).

Решение

Каждая строчка решения соответствует одному шагу задачи:

var admin, name; // две переменных через запятую

name = "Василий"; 

admin = name;

alert(admin); // "Василий"

[Задача в отдельном окне]

Константы

Константа — это переменная, которая никогда не меняется. Как правило, их называют большими буквами, через подчёркивание. Например:

var COLOR_BLUE = "#00F";
var COLOR_RED = "#0F0";
var COLOR_GREEN = "#F00";
var COLOR_ORANGE = "#FF7F00";

alert(COLOR_RED); // #0F0

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

Зачем нужны константы? Почему бы просто не использовать "#F00" или "#0F0"?

Во-первых, константа — это понятное имя, в отличие от строки "#FF7F00".
Во-вторых, опечатка в строке может быть не замечена, а в имени константы её упустить невозможно — будет ошибка при выполнении.

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

Имена переменных

На имя переменной наложены два ограничения.

Имя может состоять из: букв, цифр, символов $ и _
Первый символ не должен быть цифрой.

Например:

var myName;
var test123;

Что здесь особенно интересно - доллар '$' и знак подчеркивания '_' являются такими же обычными символами, как буквы:

var $ = 5;  // объявили переменную с именем '$'
var _ = 15; // переменная с именем '_'

alert($);

А такие переменные были бы неправильными:

var 1a; // начало не может быть цифрой

var my-name; // дефис '-' не является разрешенным символом

Регистр букв имеет значение

Переменные apple и AppLE - две разные переменные.

Русские буквы допустимы

Можно использовать и русские буквы:

var имя = "Вася";
alert(имя);

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

Зарезервированные имена

Существует список зарезервированных слов, которые нельзя использовать при именовании переменных, так как они используются самим языком, например: var, class, return, implements и др.

Некоторые слова, например, class, не используются в современном JavaScript, но они заняты на будущее. Некоторые браузеры позволяют их использовать, но это может привести к ошибкам.

Следующий пример будет работать во многих старых браузерах, которые допускают использование слова 'class' и не сработает в современных Firefox/Safari, которые выдадут синтаксическую ошибку:

var class = 5;
alert(class);

Правильный выбор имени

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

Дело в том, что большинство времени мы тратим не на изначальное написание кода, а на его развитие.

А что такое развитие? Это когда я вчера написал код, а сегодня (или спустя неделю) прихожу и хочу его поменять. Например, вывести сообщение не так, а эдак.. Обработать товары по-другому, добавить функционал.. А где у меня там сообщение хранится?..

Гораздо проще найти нужные данные, если они правильно помечены, т.е. переменная названа правильно.

Правило 1. Никакого транслита. Только английский.
Неприемлемы:
```
var moiTovari;
var cena;
var ssilka;
```
Подойдут:
```
var myGoods; 
var price;
var link;
```
Если вы вдруг не знаете английский - самое время выучить. Все равно ведь придется…
Правило 2. Использовать короткие имена только для переменных «местного значения».
Называть переменные именами, не несущими смысловой нагрузки, например a, e, p, mg - можно только в том случае, если они используются в небольшом фрагменте кода и их применение очевидно.

Вообще же, название переменной должно быть понятным. Иногда для этого нужно использовать несколько слов.
Правило 3. Переменные из нескольких слов пишутся вместеВотТак.
Например:
```
var borderLeftWidth;
```
Этот способ записи называется «верблюжьей нотацией» или, по-английски, «camelCase».

Существует альтернативный стандарт, когда несколько слов пишутся через знак подчеркивания '_':
```
var border_left_width;
```
Преимущественно в JavaScript используется вариант borderLeftWidth, в частности во встроенных языковых и браузерных функциях. Поэтому целесообразно остановиться на нём.

Ещё одна причина выбрать «верблюжью нотацию» — запись в ней немного короче, чем c подчеркиванием, т.к. не нужно вставлять '_'.
Правило последнее, главное. Имя переменной должно максимально четко соответствовать хранимым в ней данным.
Придумывание таких имен - одновременно коротких и точных, приходит с опытом, но только если сознательно стремиться к этому.

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

Бывает так, что вы написали код, через некоторое время к нему возвращаетесь, и вам надо что-то поправить. Например, изменить какую-то рамку «border…»

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

В этом случае, самый лучший ход - это переименовать переменную на ту, которую вы искали изначально. То есть, у вас в коде leftBorderWidth, а вы ее переименовываете на borderLeftWidth.

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

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

Смысл имени переменной - это «имя на коробке», по которому мы сможем максимально быстро находить нужные нам данные.

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

Создайте переменную для названия нашей планеты со значением "Земля". Правильное имя выберите сами.
Создайте переменную для имени посетителя со значением "Петя". Имя также на ваш вкус.

Решение

Каждая строчка решения соответствует одному шагу задачи:

var ourPlanetName = "Земля"; // буквально "название нашей планеты"

var visitorName = "Петя"; // "имя посетителя"

Названия переменных можно бы сократить, например, до planet и name, но тогда станет менее понятно, о чем речь. Насколько это допустимо - зависит от скрипта, его размера и сложности.

[Задача в отдельном окне]

Типы данных

В JavaScript существует несколько основных типов данных.

Число number:
```
var n = 123;
n = 12.345;
```
Тип число используется как для целых, так и для дробных чисел.
Строка string:
```
var str = "Мама мыла раму";
str = 'Одинарные кавычки тоже подойдут';
```
В JavaScript одинарные и двойные кавычки равноправны. Можно использовать или те или другие.
Тип символ не существует, есть только строка

В некоторых языках программирования есть специальный тип данных для одного символа. Например, в языке С это char. В JavaScript есть только тип «строка» string. Что, надо сказать, вполне удобно..
Булевый (логический) тип boolean. У него всего два значения - true (истина) и false (ложь).
Как правило, такой тип используется для хранения значения типа да/нет, например:
```
var checked = true; // поле формы помечено галочкой
checked = false;    // поле формы не содержит галочки
```
Мы поговорим более подробно, когда будем обсуждать логические вычисления и условные операторы.
null — специальное значение. Оно имеет смысл «ничего». Значение null не относится ни к одному из типов выше, а образует свой отдельный тип, состоящий из единственного значения null:
```
var x = null;
```
В JavaScript null не является «ссылкой на несуществующий объект» или «нулевым указателем», как в некоторых других языках. Это просто специальное значение, которое имеет смысл «ничего» или «значение неизвестно».
undefined — специальное значение, которое, как и null, образует свой собственный тип. Оно имеет смысл «значение не присвоено».
Если переменная объявлена, но в неё ничего не записано, то ее значение как раз и есть undefined:
```
var u;
alert(u); // выведет "undefined"
```
Можно присвоить undefined и в явном виде, хотя это делается редко:
```
var x = 123;
x = undefined;
```
В явном виде undefined обычно не присваивают.

Итак, существуют пять типов: number, string, boolean, null, undefined.

Эти типы данных называют примитивными, в отличие от шестого типа - «объектов», к которым мы перейдем позже.

Переменные и типы данных

Переменная

Аналогия из жизни

Копирование значений

Важность директивы `var`

Константы

Имена переменных

Зарезервированные имена

Правильный выбор имени

Типы данных

Комментарии

Содержание

Реклама

Нашли опечатку?

Последние Комментарии

Помоги другим!