Урок 4. Описание переменных и создание функций.

Теория Скрипт Результат Разбор скрипта Задание

Содержание

На этом занятии мы познакомимся функциями.

Теория

Прару слов об описании переменных: пременная может быть описана прямо при употреблении.
Например:

var d = 14;

Причем в Java Script можно завести переменные следующих типов: number, string, function, object и логического.
Тип переменной, при инициализации, указывать не обязательно.

Cоздавая переменную, вы присваиваете имя результату команды или события JavaScript. Создавая функцию , вы делаете почти то же самое, только имя присваивается целой серии команд. Множество команд JavaScript вы комбинируете в одну.

Ради примера попытаемся написать скрипт, который выводит в строку состояния дату. Делать это будем, естественно, с помощью функции.

Текст скрипта

Сам скрипт состоит из двух частей: собственно функции и команды onLoad, которая ее запускает. Вот обе части:

<SCRIPT LANGUAGE="javascript">
<!--
Скрыть от браузеров, не читающих Javascript
function dateinbar(){
   var d = new Date();

   var y = d.getFullYear();
   var da = d.getDate();
   var m = d.getMonth() + 1; var t = da + '/' + m + '/' + y;
   defaultStatus = "
Вы прибыли на страницу " + t + ".";
}
//
не скрывать -->
</SCRIPT>
...
и команда onLoad в:


<
BODY BGCOLOR="хххххх" onLoad="dateinbar()">

Результат

Эффект скрипта можно увидеть в строке состояния. Этим же скриптом мы пользовались для получения даты на прошлыx уроках.

Разбор Скрипта

Что это <!-- --> за штуки такие?

Еще одна команда. Возможно, она кажется вам знакомой. Этими знаками вы пользуетесь для комментариев в теле HTML:

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

Сначала первая часть скрипта устанавливает функцию. Потом команда в строке ее запускает. Давайте сначала разберем функцию.

function dateinbar(){
   var d = new Date();
   var y = d.getFullYear();
   var da = d.getDate();
   var m = d.getMonth() + 1;
   var t = da + '/' + m + '/' + y;
   defaultStatus = "Вы прибыли на страницу " + t + ".";
}

Схема довольно понятная. Вы пишете "function" и даете ей любое имя, какое вашей душе угодно, точно так же, как мы делали с переменными. Оно может быть какой угодно длины, если в нем нет пробелов и это слово уже не участвует в JavaScript.

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

На этот раз я выбрал имя "dateinbar()" (дата в строке состояния), потому что это функция и делает — помещает дату в строку состояния.

Очень важно!
Команды, из которых состоит функция, должны быть заключены в фигурные скобки {}. Видите, я поставил их сразу после имени функции и в самом конце?

А теперь разберем то, что находится в фигурных скобках:

Для начала заводим переменные. Им присваиваются соответствующие значения.

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

Во-первых, помните, что все это цифры. Даже метод getDay(),
который отвечает за день недели, выражается цифрой от единицы до семи.
Начнем с месяца. Как уже говорилось раньше, getMonth() — это метод, отвечающий за месяц. Теперь задумаемся о том, на какой объект воздействует метод getMonth(). Помните это из Урока 1? Метод (method) воздейcтвует на объект (object).

Может показаться, что getЧто-либо() — это метод объекта document. Вовсе нет. Метод документа — write. getMonth() на самом деле является методом объекта Date. Взгляните на скрипт еще раз. Date занимает отдельное место в команде:

d = new Date();

Я устанавливаю объект, с которым будет работать метод getMonth(). Имея дело с датой и временем, всякий раз пользуйтесь той же схемой. Нужно создать объект. Мой объект называется d (сейчас). Видите? Между прочим, я мог бы назвать его Zork или Fred, браузеру все равно. Это не имеет значения, если объект получил оригинальное имя, которое больше нигде в JavaScript не встречается.

Если вам кажется, что кое-что тут поставлено с ног на голову, я вас понимаю. Такое впечатление, что следует писать new Date = d , но это не так. Вы изучаете незнакомый язык и обязаны подчиняться его правилам.

Команда говорит: d — это объект, который представляет new Date() (новую Дату). Дата обязательно должна быть новой. Таким способом вы будете получать новую дату каждый раз, когда заходите на страницу.

Ура! У нас есть объект, на который может воздействовать метод getMonth().
Теперь присвоим нужные нам значения нашим заведенным переменным и выведем это все в строку состояния.

Вот такой вот замечательный скрипт. Надеюсь вам хоть что-то понятно :)

А теперь......

Задание

А теперь попробуйте напистать функцию которая бы при открытии страниця делала следующие деиствия:
усттанавливала цвет фона, например, розовый (pink)
, с помощью функции promt, которая возвращает переменной строку, вуденную пользователем в окне запроса, узнайте имя посетителя страници, выведите дату посещения страницы, но не в строке состояния, а прямо на странице, имя пользователя.

Синтаксис команды promt

var user_name = prompt ("Заголовок окна запроса","текст в строке");

Ответ вы можете найти здесь