Лабораторные работы МИРЭА JavaScript (1017114), страница 9

Просмтор этого файла доступен только зарегистрированным пользователям. Но у нас супер быстрая регистрация: достаточно только электронной почты!

Текст из файла (страница 9)

<!--

function parseCookie() {

// Разделение cookie.

var cookieList = document.cookie.split("; ");

// Массив для каждого cookie в cookieList.

var cookieArray = new Array();

for (var i = 0; i <cookieList.length; i++) {

// Разделение пар имя-значение.

var name = cookieList[i].split("=");

// Декодирование и добавление в cookie-массив.

cookieArray[unescape(name[0])] = unescape(name[1]);

}

return cookieArray;

}

function setCookie(visits) {

/* Счетчик числа посещений и

определение срока хранения в 1 год. */

var expireDate = new Date();

// Установка даты автоматического удаления.

expireDate.setYear(expireDate.getYear() + 1);

// Сохранение числа посещений.

document.cookie = "Visits=" + visits +

"; expires=" + expireDate.toGMTString() + ";";

}

if ("" == document.cookie) {

// Инициализация cookie.

setCookie(1);

document.write("<H3>Поздравляю Вас с первым посещением моего сайта.</H3>");

}

else {

// Анализ cookie.

var cookies = parseCookie();

// Вывод приветствия, числа посещений и увеличение числа посещений на 1.

document.write("<H3>Рад снова видеть Вас на моем сайте! Число Ваших посещений - " +

cookies.Visits++ + " !</H3>");

// Обновление cookie.

setCookie(cookies.Visits);

}

//-->

</script>

</body>

</html>

Применение переменных

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

var message;

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

var message;

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

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

var message;

message = 'Привет';

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

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

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

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

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

var num = 100500;

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

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

var num = 100500;

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

message = num;

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

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

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

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

Задание: Создайте документ HTML, в котором средствами JavaScript:

1. Объявите две переменные: admin и name.

2. Запишите в name строку "Василий".

3. Скопируйте значение из name в admin.

4. Выведите admin (должно вывести «Василий»).

Объявление констант

Константа — это переменная, которая никогда не меняется. Как правило, их называют

большими буквами, через подчёркивание. Например:

var COLOR_BLUE = "#00F";

var COLOR_RED = "#0F0";

var COLOR_GREEN = "#F00"; var COLOR_ORANGE = "#FF7F00";

alert(COLOR_RED); // #0F0

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

договариваемся этого не делать.

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

1. Во-первых, константа — это понятное имя, в отличие от строки "#FF7F00".

2. Во-вторых, опечатка в строке может быть не замечена, а в имени константы её

упустить невозможно — будет ошибка при выполнении.

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

избежать ошибок.

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

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

2. Первый символ не должен быть цифрой.

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

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

Существует список зарезервированных слов, которые нельзя использовать при

именовании переменных, так как они используются самим языком, например: var,

class, return, implements и др.

Некоторые слова, например, class, не используются в современном JavaScript, но они

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

привести к ошибкам.

Типы данных в JavaScript

Число number:

var n = 123;

n = 12.345;

Строка string:

var str = "Мама мыла раму";

str = 'Одинарные кавычки тоже подойдут';

1. В JavaScript одинарные и двойные кавычки равноправны. Можно

использовать или те или другие.

2. Тип символ не существует, есть только строка

3. В некоторых языках программирования есть специальный тип данных для одного

символа. Например, в языке С это char. В JavaScript есть только тип «строка»

string. Что, надо сказать, вполне удобно.

Булевый (логический) тип boolean. У него всего два значения - true (истина) и

false (ложь).

Как правило, такой тип используется для хранения значения типа да/нет, например: var checked = true; // поле формы помечено галочкой

checked = false; // поле формы не содержит галочки

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

условные операторы.

null — специальное значение. Оно имеет смысл «ничего». Значение null не относится

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

значения null:

var age = null;

1. В JavaScript null не является «ссылкой на несуществующий объект» или

«нулевым указателем», как в некоторых других языках. Это просто специальное

значение, которое имеет смысл «ничего» или «значение неизвестно».

2. В частности, код выше говорит о том, что возраст age неизвестен.

3. undefined — специальное значение, которое, как и null, образует свой

собственный тип. Оно имеет смысл «значение не присвоено».

Если переменная объявлена, но в неё ничего не записано, то ее значение как раз и

есть undefined:

var u;

alert(u); // выведет "undefined"

Можно присвоить undefined и в явном виде, хотя это делается редко:

var x = 123;

x = undefined;

В явном виде undefined обычно не присваивают, так как это противоречит его

смыслу. Для записи в переменную «пустого значения» используется null.

Объекты object

Первые 5 типов называют «примитивными».

Особняком стоит шестой тип: «объекты». К нему относятся, например, даты, он

используется для коллекций данных и для многого другого.

ИТОГО: Есть 5 «примитивных» типов: number, string, boolean, null, undefined и

объекты object.

Пример объявления переменных и их использования:

<!DOCTYPE html>

<html>

<body>

<script> var pi=3.14;

var name="John Doe";

var answer='Yes I am!';

document.write(pi + "<br>");

document.write(name + "<br>");

document.write(answer + "<br>");

</script>

</body>

</html>

Здесь в скрипте <br> - это тег HTML, который переводит каретку на новую строку

(переход на новую строку)

Задание: Создать приведенный пример документа в любом редакторе. Удобнее

использовать редактор Visual Studio или любой другой, поддерживающий языки

разметки. Сохранить файл с названием Пример1_3.html и открыть (запустить) его в любом

браузере.

Пример

<!DOCTYPE html>

<html>

<body>

<p>Нажмите кнопку для объявления переменной и вывода результата.</p>

<button onclick="myFunction()">Try it</button>

<p id="demo">Текст, помеченный меткой demo</p>

<script>

//объявляем функцию, которую будет вызывать кнопка по методу onclick

function myFunction()

{

//объявляем переменную строковую

var carname="Volvo";

/*

document.getElementById - метод объекта document. Он возвращает ссылку на узел документа,

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

*/

//метод getElementById, получающий данные из тега по метке demo

// Свойство innerHTML устанавливает или получает всю разметку

// и содержание внутри данного элемента.

document.getElementById("demo").innerHTML=carname;

}

</script>

</body>

</html>

Задание: Создать приведенный пример документа в любом редакторе. Удобнее

использовать редактор Visual Studio или любой другой, поддерживающий языки

разметки. Сохранить файл с названием Пример1_4.html и открыть (запустить) его в любом

браузере.

Пример на Undefined and Null:

<!DOCTYPE html>

<html>

<body>

<script>

var person;

var car="Volvo";

// document.write- метод, выводящий на страницу переданные ему аргументы

document.write(person + "<br>");

document.write(car + "<br>");

var car=null

document.write(car + "<br>");

</script>

</body>

</html>

Задание: Создать приведенный пример документа в любом редакторе. Удобнее

использовать редактор Visual Studio или любой другой, поддерживающий языки

разметки. Сохранить файл с названием Пример1_5.html и открыть (запустить) его в любом

браузере.

Пример создает объект с названием "person" и добавляет 4 свойства объекту:

<!DOCTYPE html>

<html>

<body>

<script>

var person=new Object();

person.firstname="John";

person.lastname="Doe";

person.age=50;

person.eyecolor="blue";

document.write(person.firstname + " is " + person.age + " years old.");

</script>

</body>

</html>

Задание: Создать приведенный пример документа в любом редакторе. Удобнее

использовать редактор Visual Studio или любой другой, поддерживающий языки разметки. Сохранить файл с названием Пример1_6.html и открыть (запустить) его в любом

браузере.

Основные операторы

Для работы с переменными, со значениями, JavaScript поддерживает все стандартные

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

1. Термины: «унарный», «бинарный», «операнд»

У операторов есть своя терминология, которая используется во всех языках

програмирования.

 Операнд — то, к чему применяется оператор. Например: 5 * 2 — оператор

умножения с левым и правым операндами. Другое название: «аргумент оператора».

 Унарным называется оператор, который применяется к одному выражению.

Например, оператор унарный минус "-" меняет знак числа на противоположный:

var x = 1;

Характеристики

Список файлов лабораторной работы