1. 3. СРЕДСТВА ЯЗЫКА JAVASCRIPT 

   3.3. Данные, переменные и константы. 

   Содержание 

   3.3.1. Типы данных.  

   3.3.2. Переменные и константы. 

   3.3.3. Преобразование типов. 

   3.3.4. Упражнения. 

   3.3.5. Контрольные вопросы. 

Внимание! При выполнении упражнений, содержащихся в настоящем разделе:

• •.все файлы с выполненными заданиями должны быть помещены в папку exercises и иметь имена exercise_НомерПодразделаНомерПримера.htm, например: exercise_3_3_1.html, exercise_3_3_2.html и так далее; 

• •.Ваша страничка со ссылками на выполненные задания (файл exercises.html), которую Вы подготовили при прохождении предыдущего раздела, должна быть дополнена ссылками на все страницы с выполненными заданиями настоящего подраздела с краткими описаниями упражнений.  Ссылки и описания должны быть вставлены в html-таблицу с двумя колонками: в первой колонке — ссылки, во второй — описание. 

1. • 1. 3.3.1. Типы данных. 

В JavaScript используются следующие основные типы данных:

• •.строка; 

• •.число; 

• •.логическое или булево значение; 

• •.специальные типы данных. 

Строковые литералы (строки) заключаются в двойные или одинарные кавычки. Строка – это связанный набор символов, таких как буквы, знаки препинания и цифры. Чаще всего строки представляют собой какой-либо текст, например: 'Республика Крым'.

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

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

Вещественные числа могут представляться с дробной десятичной частью (3.141592653589), либо в экспоненциальном виде (3.14e2 или 3.14E2). При экспоненциальной записи числа символ  “e” (или “E”) означает «10 в степени». Числа в JavaScript могут быть от 10308 до 10-308 (нуль целых с тремястами семью нулями и единицей после запятой).

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

• •.NaN (несуществующее число), свидетельствует об обращении к несуществующему числу и при выполнении недопустимых арифметических операций (например, при делении 0 на 0); 

• •.Infinity — такое значение присваивается, при превышении максимально допустимых значений числового типа при выполнении арифметических операций (например, при делении числа на 0). 

Булевы значения могут принимать лишь два значения: true (истина) и false (ложь). К булевым выражениям мы вернемся в подразделе 3.5. Здесь же вам нужно запомнить, что такой тип данных существует в JavaScript, а также, что наименование этот тип данных получил в честь английского математика Джорджа Буля (1815-1864).

Специальные типы данных:

• •.null (неопределенный тип), свидетельствует о полном отсутствии каких-либо данных; 

• •.undefined (неопределяемый тип), чаще всего свидетельствует об ошибке в вашей программе. 

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

1. • 1. 3.3.2. Переменные и константы. 

Переменные имеют огромное значение в любом языке программирования. Переменная – это имя (идентификатор), присваиваемое ячейке памяти компьютера, которая хранит определенные литералы во время исполнения программы на JavaScript. Имена переменных не могут начинаться с цифры и содержать пробелы.

Чтобы объявить (создать) переменную в языке JavaScript используется оператор var, вслед за которым указывается имя, которое вы хотите присвоить переменной, например:
var a1, a_1, b;. В этом примере созданы три переменные.

Переменной при создании можно присвоить начальное значение:
var а1=314, a_1=3.14, b='Crimea';. В этом примере созданы три переменные и им присвоены значения: первым двум переменным — числа, переменной b — строка.

Знак «=» называется операцией присваивания. С помощью операции присваивания создаются операторы присваивания: в левой части — переменная, в правой — то, что заносится в эту переменную.

Переменную можно образовать и без ключевого слова var,  простым присваиванием:  а1=314;.

Область действия переменных — это область, где могут использоваться эти переменные в программе. В JavaScript существует две области действия переменных:

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

• •.локальная, когда переменную можно использовать только внутри той функции, в которой эта переменная создана (объявлена).  

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

Чтобы объявить глобальную переменную, объявите переменную просто присваиванием  (или в функции или вне функции).

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

Следует знать о переменных также следующее:

• •.в именах переменных можно использовать символы как верхнего и нижнего регистра, так и их сочетание; 

• •.до объявления переменной ее значение имеет неопределенный тип (undefined); 

• •.имя переменой не может начинаться с цифры; 

• •.в именах переменных недопустимы пробелы; если необходим разделитель, используйте символ подчеркивания «_»; 

• •.в качестве имен переменных нельзя использовать зарезервированные слова JavaScript (например: var, const). 

Константы определяются при помощи ключевого слова const, например:
const  pi=3.141592653589, e=2.718281828459045;

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

1. • 1. 3.3.3. Преобразование типов. 

Для преобразования строк в числа в JavaScript предусмотрены встроенные функции parseInt() и parseFloat(). Можно также использовать встроенную функцию Number(). Вы еще не знакомы с понятием «функция», поэтому пока что можно считать, что это выражение с круглыми скобками, в которых в качестве параметров указываются преобразуемые данные.

Функция  parseInt(строка, основание) преобразует строку в целое число в системе счисления по указанному основанию (8, 10, 16). Основание можно не указывать, тогда  предполагается десятеричная система счисления (основание 10).

Функция  parseFloat(строка) преобразует строку в число с плавающей точкой.

Функция Number(строка) преобразует строку в число с плавающей точкой или целое, в зависимости от значения строки.

Обратная задача преобразования строк в числа осуществляется с помощью встроенной функции String(n), которая преобразует число n в строку.

Функция IsNaN(значение) может использоваться для определения того, является ли значение числом. Если указанное значение не является числом, функция возвращает логическое значение true, а иначе – false. При этом эта функция считает числом и строку, содержащую только числа, а также логические значения.

Функция typeof(значение) предназначена для определения типа переменной. В зависимости от задаваемого значения функция выдаёт:

• •.number — если значение — число; 

• •.string — если строка; 

• •.boolean — если логическое значение; 

• •.undefined — если значения нет или не определено; 

• •.object — если значение является объектом. 

Учитывая важность понятия типов данных приведем следующие примеры:

Number(“314”)       // равно 314

Number(“-3.14”)     // равно -3.14

String (314)        // равно “314”

String (-3.14)      // равно “-3.14”

parseInt(“3.14”)    // равно 3

parseInt(“-3.14”)   // равно -3

parseInt(“Крым”)    // равно NaN

parseInt(“0хFF”,16)  // шестнадцатиричное число преобразовано в 255

parseFloat(“3.14”)  // равно 3.14

parseFloat(“-3.14”) // равно -3.14

typeof(“Crimea”)    // равно string

typeof(3.14)        // равно number

typeof(“3.14”)      // равно string

isNaN(314)           // равно false

isNaN(“314”)         // равно false

isNaN(“Крым-2005”)  // равно true

var a= “314”; alert(typeof(a)); // выдаст string

alert(typeof(Number(a)));      // выдаст number

a=314; alert(typeof(a));       // выдаст number

alert(typeof(String(a)));      // выдаст string

a=3.14; b=String(a);

alert(typeof(a));              // выдаст number

alert(typeof(b));              // выдаст string

Как следует из показанных выше примеров,  преобразование типов данных и преобразование типов переменных выполняется одинаково. Поэкспериментируйте с каждым из этих примеров. Для того, чтобы проверить правильность срабатывания каждой строки, используйте метод alert(), например: alert(Number("314")) — выдаст результат для первого примера.

Ниже приведены примеры html-документов, в которые вставлены простые скрипты по определению числового и строкового типов: данных (листинг 3.3.1) и переменных (листинг 3.3.2).

Листинг 3.3.1.

<html><head>

<title>Студент Петров. Пример 3.3.1.</title>

</head>

<body>

<h2>Пример 3.3.1.Эксперименты по определению типов данных</h2>

<h3>Вывод окна предупреждения с типом данного, равного 3.14</h3>

<script>

alert(typeof(3.14)); // должно появиться number;

</script>

<h3>Вывод окна предупреждения с типом данного, равного "3.14"</h3>

<script>

alert(typeof("3.14")); // должно появиться string;

</script>

</body></html>

Листинг 3.3.2.

<html><head>

<title>Студент Петров. Пример 3.3.2.</title>

</head>

<body>

<h2>Пример 3.3.2. Студент Петров. Эксперименты по определению типов переменных</h2>

<h3>Вывод окна предупреждения с типом переменной, которой присвоено число 3.14</h3>

<script type="text/javascript">

var a;

a=3.14;

alert(typeof(a)); // должно появиться number;

</script>

<h3>Вывод окна предупреждения с типом переменной, которой присвоена строка "3.14"</h3>

<script>

var b="3.14";

alert(typeof(b)); // должно появиться string;

</script>

</body></html>

В листинге 3.3.3 приведён ещё один пример html-документа со скриптами, в которых показано образование, преобразование и определение типов переменных. Вывод результатов осуществляется с использованием метода document.write().

Листинг 3.3.3.

<html><head>

<title>Студент Петров. Пример 3.3.3.</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

</head>

<body>

<h2>Пример 3.3.3. Образование, преобразование и определение типов переменных</h2>

<h3>Образуем и выводим числовую и строковую переменные:</h3>

<script type="text/javascript">

var num_pi=3.142, str_pi="3.1415"; //образуем числовую и строковую переменные

document.write('<ul>');

document.write('<li>n_pi = '); document.write(num_pi); document.write('</li>');

document.write('<li>s_pi = '); document.write(str_pi); document.write('</li>');

document.write('</ul>');

</script>

<h3>Определяем и выводим типы образованных переменных:</h3>

<script>

var type_num_pi, type_str_pi;

type_num_pi=typeof(num_pi);

type_str_pi=typeof(str_pi);

document.write('<ul>');

document.write('<li>тип num_pi = '); document.write(type_num_pi); document.write('</li>');

document.write('<li>тип str_pi = '); document.write(type_str_pi); document.write('</li>');

document.write('</ul>');

</script>

<h3>Образуем и выводим две новые переменные, преобразуя две первые переменные:</h3>

<script>

var i_pi = parseInt(num_pi), r_pi = parseFloat(str_pi); // числовые: целую и вещественную

document.write('<ul>');

document.write('<li>i_pi = '); document.write(i_pi); document.write('</li>');

document.write('<li>r_pi = '); document.write(r_pi); document.write('</li>');

document.write('</ul>');

</script>

<h3>Определяем и выводим типы вновь образованных переменных:</h3>

<script>

var type_i_pi, type_r_pi;

type_i_pi=typeof(i_pi);

type_r_pi=typeof(r_pi);

document.write('<ul>');

document.write('<li>тип i_pi = '); document.write(type_i_pi); document.write('</li>');

document.write('<li>тип r_pi = '); document.write(type_r_pi); document.write('</li>');

document.write('</ul>');

</script>

</body></html>

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

Листинг 3.3.4.

<html><head>

<title>Студент Петров. Пример 3.3.4.</title>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

</head>

<body>

<h2>Пример 3.3.4. Образование булевых данных и специальных зачений</h2>

<h3>Образуем и выводим переменные логического типа с логическими данными:</h3>

<script type="text/javascript">

var x1_logical=true, x2_logical=false; //образуем две логические переменные

document.write('<ul>');

document.write('<li>x1_logical = '); document.write(x1_logical); document.write('</li>');

document.write('<li>x2_logical = '); document.write(x2_logical); document.write('</li>');

document.write('</ul>');

</script>

<h3>Определяем и выводим типы образованных переменных:</h3>

<script>

document.write('<ul>');

document.write('<li>тип x1_logical = '); document.write(typeof(x1_logical)); document.write('</li>');

document.write('<li>тип x2_logical = '); document.write(typeof(x2_logical)); document.write('</li>');

document.write('</ul>');

</script>

<h3>Образуем и выводим специальные значения:</h3>

<script>

var x1 = 3.14/0, x2 = 0/0; // математически некорректные операции

document.write('<ul>');

document.write('<li>x1 = 3.14/0 = '); document.write(x1); document.write('</li>');

document.write('<li>x2 = 0/0 = '); document.write(x2); document.write('</li>');

document.write('</ul>');

</script>

</body></html>

3.3.4. Упражнения.

Упражнение 3.3.1.  Повторите пример из листинга 3.3.1,  дополнив ещё одним скриптом с определением типа логических данных. Кроме этого, дополните веб-страницу нумерованным списком с ответами на 1-й, 2-й и 3-й контрольные вопросы.

Упражнение 3.3.2.  Повторите пример из листинга 3.3.2, дополнив ещё одним скриптом с созданием и определением типа логических переменных (переменных, которым присвоены данные логического типа). Кроме этого, дополните веб-страницу нумерованным списком с ответами на 4-й, 5-й и 6-й контрольные вопросы.

Упражнение 3.3.3.  Повторите пример из листинга 3.3.3 «как есть». Кроме этого, дополните веб-страницу нумерованным списком с ответами на 7-й, 8-й и 9-й контрольные вопросы.

Упражнение 3.3.4.  Повторите пример из листинга 3.3.4, дополнив  ещё одним скриптом с созданием и выводом констант. Кроме этого, дополните веб-страницу нумерованным списком с ответами на 10-й, 11-й и 12-й контрольные вопросы.

Внимание! Как и прежде Вы должны соответствующим образом оформить выполненные упражнения:

1) вместо «Петров Иван» должны отображаться Ваши фамилия и имя;

2) к каждому html-документу с упражнением должен быть подключён css-файл с таблицей стилей, разработанной при освоении предыдущего раздела;

3) на каждой странице-упражнении должна быть строка меню со ссылками для возврата на страницу со списком упражнений и на «домашнюю»;

4) файлы с упражнениями должны быть помещены в папку exercises и иметь имена: exercise_3_3_1.html -  exercise_3_3_4.html;

5) таблица со списком-ссылками (файл exercises.html) должна быть дополнена строками со ссылками на эти четыре упражнения.

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

3.3.5. Контрольные вопросы.

1. 1.Типы данных в языке Javascript? 

2. 2.Создание констант? 

3. 3.Способы создания переменных? 

4. 4.Ключевое слово языка Javascript, предназначенное для образования переменных? 

5. 5.Функции для преобразования переменной строкового типа в переменную числового типа? 

6. 6.Функции для преобразования переменной числового типа в переменную строкового типа? 

7. 7.Функция для определения типа переменной? 

8. 8.Функция для преобразования переменной вещественного типа в целочисленную переменную? 

9. 9.Специальное значение, которое присваивается переменной при делении числа на ноль? 

10. 10.Специальное значение, которое присваивается переменной при делении ноля на ноль? 

11. 11.Функция для определения того, является ли значение числом? 

12. 12.Можно ли изменить значение константы присваиванием ей нового значения?