Электронная Россия (2002-2010), ЭР-2004 Лекция # 4 Основы использования JavaScript. - презентация

1 Электронная Россия ( ), ЭР-2004 Лекция # 4 Основы использования JavaScript

2 Электронная Россия ( ), ЭР-2004 Function // Функция для отсылки формы на сервер function SendForm() { if( Check()) window.document.forms[0].submit; } // Функция для проверки содержимого формы function Check() { var doc = window.document;

3 Электронная Россия ( ), ЭР-2004 if( doc.forms[0].elements[0].value == '' || doc.forms[0].elements[1].value == '' || doc.forms[0].elements[2].value == '') { alert( 'Поля не могут быть пустыми'); return false; } еlse return true; }

4 Электронная Россия ( ), ЭР-2004 Пожалуйста, введите информацию: Фамилия

5 Электронная Россия ( ), ЭР-2004 Имя Отчество td> Kaк с Вами связаться

6 Электронная Россия ( ), ЭР-2004

7 Электронная Россия ( ), ЭР-2004 If..else если результат выражения имеет значение true, выполняются инструкции, расположенные в блоке if; если результат выражения имеет значение false, выполняются инструкции, расположенные в блоке else. Если блок else не указан, выполнение программы переходит на следующий элемент после всего блокa if..else.

8 Электронная Россия ( ), ЭР-2004 if( Check()) Send(); else Clear();

9 Электронная Россия ( ), ЭР-2004 if( Check()) { alert('Отсылаем форму'); Send(); } else { alert('Очищаем форму'); Clear(); }

10 Электронная Россия ( ), ЭР-2004 function Check() { var doc = window.document; if( doc.forms[0].elements[0].value == '') { alert('Поля не могут быть пустыми'); return false; } else return true; }

11 Электронная Россия ( ), ЭР-2004 New для создания нового объекта Date, который является встроенным объектом языка JavaScript; для создания нового пользовательского объекта.

12 Электронная Россия ( ), ЭР-2004 varName = new objectName(params) varName - имя переменной, в которой будет храниться новая копия объекта; objectName - имя объекта. При использовании встроенного объекта Date используется слово Date (с большой буквы!), при использовании пользовательских объектов - имена объектов; params - один или более параметров, передаваемых при создании копии объекта.

13 Электронная Россия ( ), ЭР-2004 user = new someUser("Alex Fedorov"); alert( user.name); function someUser(nameParam) { this.name = nameParam; return (this); }

14 Электронная Россия ( ), ЭР-2004 Return function Check() { var doc = window.document; if( doc.forms[0].elements[0].value == '') { alert('Поля не могут быть пустыми'); return false; } else return true; }

15 Электронная Россия ( ), ЭР-2004 This для ссылки на текущую форму или интерфейсный элемент в обработчике события (например, onClick или onSubmit); для задания нового свойства в пользовательском объекте.

16 Электронная Россия ( ), ЭР-2004

17 Электронная Россия ( ), ЭР-2004 JS - CP1197 function myTest(obj) { alert(obj.name); return; } Пример использования ключевого слова this

18 Электронная Россия ( ), ЭР

19 Электронная Россия ( ), ЭР-2004 Var var VariableName; var VariableName = value; VariableName - имя переменной; value - значение, присваиваемое переменной.

20 Электронная Россия ( ), ЭР-2004 var someVar = 100; function showVar() { alert( someVar); }

21 Электронная Россия ( ), ЭР-2004 var someVar = 100; function showLocalVar() { var someVar = 256; alert( 'local var = ' + someVar); showGlobalVar(); } function showGlobalVar() { alert( 'global var = ' + someVar); }

22 Электронная Россия ( ), ЭР-2004 While loopCount = 0; while( loopCount < 10) { document.write( "LoopCount = " + loopCount + " "); loopCount++;

23 Электронная Россия ( ), ЭР-2004 With function Show() { with( document.forms[0].elements[0]) { alert( name); alert( value); }

24 Электронная Россия ( ), ЭР-2004 Объект Array JavaScript // создание нового массива allStr = new Array(5); // заполнение массива allStr[0] = "Message #1"; allStr[1] = "Message #2"; allStr[2] = "Message #3"; allStr[3] = "Message #4"; allStr[4] = "Message #5";

25 Электронная Россия ( ), ЭР-2004 // функция для отображения элемента массива function showMsg(ndx) { alert(allStr[ndx]); }

26 Электронная Россия ( ), ЭР-2004 JavaScript // создание нового массива и его заполнение allStr = new Array("Message #1", "Message #2", "Message #3", "Message #4", "Message #5"); // функция для отображения элемента массива function showMsg(ndx) { alert(allStr[ndx]); }

27 Электронная Россия ( ), ЭР-2004

28 Электронная Россия ( ), ЭР-2004 Методы объекта Array МетодОписание join Объединяет все элементы массива в одну строку reverse Изменяет порядок элементов в массиве - первый элемент становится последним, последний - первым SortВыполняет сортировку элементов массива

29 Электронная Россия ( ), ЭР-2004 JavaScript myArray = new Array("Mother", "Father", "Sister", "Brother", "Uncle"); function showElement(ndx) { alert(myArray[ndx]); } function showAll() {

30 Электронная Россия ( ), ЭР-2004 for( i = 0; i

31 Электронная Россия ( ), ЭР-2004 function test() { alert(myArray.join()); }

32 Электронная Россия ( ), ЭР-2004 function test() { alert(myArray.join(" _|_ ")); }

33 Электронная Россия ( ), ЭР-2004 function test() { myArray.reverse(); alert(myArray.join(";")); }

34 Электронная Россия ( ), ЭР-2004 function test() { myArray.sort(); alert(myArray.join(";")); }

35 Электронная Россия ( ), ЭР-2004 Создание многомерных массивов JavaScript Multidimentional Array a = new Array(4); for( i=0; i < 4; i++) { a[i] = new Array(4); for( j=0; j < 4; j++)

36 Электронная Россия ( ), ЭР-2004 { a[i][j] = "["+i+","+j+"]"; } for( i=0; i < 4; i++) { str = "Row "+i+":"; for( j=0; j < 4; j++)

37 Электронная Россия ( ), ЭР-2004 { str += a[i][j]; } document.write( str, " "); }

38 Электронная Россия ( ), ЭР-2004 Объект Boolean bfalse = new Вoolean(false); btrue = new Вoolean(true);

39 Электронная Россия ( ), ЭР-2004 JavaScript // создадим две булевых переменных bfalse = new Вoolean(false); btru = new Вoolean(true); // выведем их значения (булевы значения) document.write(bfalse.valueOf()+" "); document.write(btrue.valueOf()+" ");

40 Электронная Россия ( ), ЭР-2004 // выведем строчные эначения document.write(bfalse.toString()+" "); document.write(btrue.toString()+" ");

41 Электронная Россия ( ), ЭР-2004 Объект Date MyDate = new Dаtе([параметры]); без параметров - экземпляр будет содержать текущую дату и время. Например, today = new Date(); строка, представляющая собой дату в следующем формате: "Месяц день, год часы:минуты:секунды". Например, someDate = new Date("May 15, 1996"). Если число часов, минут или секунд на указано, их значения равны 0; набор целочисленных значений для года, меснца и дня. Например, otherDay = new Date( 96, 4, 15); набор целочисленных значений для года, месяца, дня, часов, минут и секунд. Например, sameDay = new Date( 96, 4, 15, 15, 30, 0);

42 Электронная Россия ( ), ЭР-2004 JavaScript today = new Date(); document.write("today="+today+" "); someDate = new Date("May 16, 1996"); document.write("someDate="+someDate+" ");

43 Электронная Россия ( ), ЭР-2004 otherDay = new Date( 96, 4, 15); document.write("otherDay="+otherDay+" "); sameDay = new Date( 96, 4, 16, 15, 30, 0); document.write("sameDay="+sameDay+" ");

44 Электронная Россия ( ), ЭР-2004 Методы объекта Date методы установки (set) - методы для установки даты и времени у экземпляров объекта Date; методы определения (get) - методы для определения даты и времени у экземпляров объекта Date; методы преобразования (to) - методы для преобразования даты и времени в строки; методы для обработки даты.

45 Электронная Россия ( ), ЭР-2004 Значения объекта Date ЗначениеДиапазон Число секунд и минут0..59 Число часов0..23 День недели0..6 Дата1..31 Месяц0..11 (Январь..Декабрь) ГодЧисло лет с 1900

46 Электронная Россия ( ), ЭР-2004 JavaScript someDate = new Date( "May 15, 1996"); document.write("someDate="+someDate+" "); document.write("getDay ="+someDate.getDay()+" ");

47 Электронная Россия ( ), ЭР-2004 document.write("getMonth="+someDate.getMonth()+ " "); document.write("getYear ="+someDate.getYear()+" ");

48 Электронная Россия ( ), ЭР-2004 JavaScript today = new Date(); // задать дату endYear = new Date("December 31, 1990"); // поменять год endYear.setYear(today.getYear()); // вычислить число миллисекунд в дне

49 Электронная Россия ( ), ЭР-2004 msPerDay = 24 * 60 * 60 * 1000; // получить число дней daysLeft = (endYear.getTime() - today.getTime()) / msPerDay; // округлить daysLeft = Math.round(daysLeft); // показать document.write("Number of days left in the year: "+daysLeft);