Добавил:
Upload Опубликованный материал нарушает ваши авторские права? Сообщите нам.
Вуз: Предмет: Файл:
Лаба 4 ИТ.doc
Скачиваний:
3
Добавлен:
20.07.2019
Размер:
91.65 Кб
Скачать

РОССИЙСКИЙ ГОСУДАРСТВЕННЫЙ УНИВЕРСИТЕТ

ИННОВАЦИОННЫХ ТЕХНОЛОГИЙ И ПРЕДПРИНИМАТЕЛЬСТВА

ПЕНЗЕНСКИЙ ФИЛИАЛ

Кафедра экономики и экономических информационных систем

ОТЧЕТ

о выполнении лабораторной работы по Информационным технологиям

Тема: «Знакомство с программной средой Java Script»

Выполнила:

студентка гр. 09Э3

Тарасова Светлана

Проверил:

Румянцев С.А.

Пенза, 2010 г.

JavaScript - это язык программирования, основанный на объектах: и языковые средства, и возможности среды представляются объектами, а сценарий (программа) на JavaScript - это набор взаимодействующих объектов. Объект JavaScript - это неупорядоченный набор свойств, каждое из которых имеет нуль или более атрибутов, которые определяют, как это свойство может использоваться. Например, если атрибуту свойства ReadOnly (неизменяемый) присвоено значение true (истина), то все попытки программно изменить значение этого свойства будут безрезультатны. Свойства - это контейнеры, которые содержат другие объекты, примитивные значения и методы. Примитивное значение - это элемент любого из встроенных типов: Undefined, Null, Boolean, Number и String; объект - это элемент еще одного встроенного типа Object; метод - функция, ассоциированная с объектом через свойство.

JavaScript содержит несколько встроенных объектов, таких, как Global, Object, Error, Function, Array, String, Boolean, Number, Math, Date, RegExp. Кроме того, JavaScript содержит набор встроенных операций, которые, строго говоря, не обязательно являются функциями или методами, а такжн набор встроенных операторов, управляющих логикой выполнения программ. Синтаксис JavaScript в основном соответствует синтаксису языка Java, но упрощен в сравнении с ним, чтобы сделать язык сценариев легким для изучения. Так, к примеру, декларация переменной не содержит ее типа, свойства также не имеют типов, а декларация функции может стоять в тексте программы после ее вызова.

Конструкции

Точка с запятой

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

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

Эти две строки полностью эквивалентны:a = 5

a = 5;

В javascript перевод строки почти всегда подразумевает точку с запятой.

В частности, многие новички сталкиваются с ошибками при многострочных присваиваниях и вызовах.

Вот так не будет работать:var a = "длинная

строка "

Так как перевод строки подразумевает точку с запятой, и javascript поймет это какvar a = "длинная;

строка ";

То есть, сообщит о незавершенной строке (unterminated literal) в первой строчке этого примера.

Или, например, следующие два примера кода эквивалентны:return

result;

тоже самое, что иreturn;

result;

и совсем не то же, что return result

В обоих случаях будет возвращено значение undefined (это значение возвращает любая функция, где нет оператора return, либо оператор return вызван без аргумента), а не result.

Чтобы многострочные операторы работали как надо - перенос строки можно указывать обратным слешем "\", вот так:1 var a = "длинная \

2 строка "

3

4 return \

5 result;

Полный список синтаксических конструкций и операторов приведен в справочнике. Они похожи на PHP/C/Java, но многие имеют особенности, знание которых поможет грамотно программировать на javascript.

Блоки

Блоки задаются фигурными скобками.

Локальные переменные объявляются при помощи var. Причем, в отличие от C/Java, сам по себе блок не задает отдельную область видимости.

1 var i = 0

2 {

3 var i=5

4 alert(i) // 5

5 }

6 alert(i) // тоже 5

Комментарии

Комментарии возможны в двух вариантах // и /*...*/:1 // однострочные комментарии

2

3 /*

4 многострочные

5 комментарии

6 */

Переменные

Переменные в javascript слабо типизированы. Это означает, что при объявлении не нужно указывать тип. Можно присвоить любой переменной любое значение.

Однако при этом интерпретатор javascript (браузер) всегда знает, какого типа значение содержит данная переменная, а значит - какие операции к ней применимы.

Переменную не обязательно объявлять. Достаточно ее просто присвоить:x = 5

Далее мы разберем основные типы переменных и действия с ними.

Функции

Функции задаются объявлением function со списком параметров:function sayHello(name) {

alert("Hello "+name)

}

Язык javascript предоставляет очень мощные возможности по работе с функциями.

Например:

Неопределенное количество аргументов, подсредством arguments

Замыкания

Область видимости

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

Локальная переменная объявляется так:var i

При объявлении можно тут же присвоить переменной значение и объявить другие переменные:// то же самое что 3 отдельных объявления c var

var a=5, b=6, str = "Строка"

В следующем примере переменная a в функции go объявлена как локальная. Поэтому глобальное значение a=1 не изменяется в процессе выполнения go.

1 a = 1

2 function go() {

3 var a = 6

4 }

5

6 go()

7 alert(a) // => 1

А здесь - ключевое слово var опущено, поэтому значение меняется:1 a = 1

2 function go() {

3 a = 6

4 }

5

6 go()

7 alert(a) // => 6

Кстати, глобальных переменных в javascript на самом деле нет. То, что называют "глобальными" - на самом деле свойства специального объекта window. Например, в последнем примере alert(window.a) тоже выдало бы 6.

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

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

Как правило - всё, что относится к компоненту, объявляется в виде свойств единого глобального объекта: ExtJS, dojo и т.п. Вы можете увидеть это в любом известном JS-фреймворке.

Обратите внимание, в javascript все директивы var срабатывают при входе в функцию, неважно где они находятся.

Например, посмотрим на функцию:01 function cmp(a,b) {

02 if (a>b) {

03 res = 1

04 } else if (a<b) {

05 res = -1

06 } else {

07 var res = 0

08 }

09

10 return res

11 }

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

Поэтому в примере выше переменная res будет во всех случаях локальная. Несмотря на то, что само объявление var res находится ниже по коду, чем первое обращение к res, интерпретатор создает все переменные на этапе входа в функцию, так что эта переменная локальна.

Основные типы

Строки

Для объявления строк используются кавычки - простые ' или двойные ". Между ними нет никакой разницы.a = 'моя'

b = "строка"

Для конкатенации строк используется оператор +.

1 a = "моя"

2 b = "строка"

3 alert(a + ' ' + b)

Более подробно строки и другие базовые типы рассмотрены в статье Базовые типы: Строки, Числа, Boolean.

Объекты

Javascript - объектный язык. В нем все является объектами. Строки, числа, функции и массивы - все это объекты со своими методами и свойствами. Это надо знать и иметь в виду с самого начала.

Методы объектов вызываются через точку. Например, у строки String есть метод toUpperCase, возвращающий строку в верхнем регистре:

1 name = "Vasya"

2

3 alert( name.toUpperCase() )

Или даже так:

1 alert( "Vasya".toUpperCase() )

Практически всё в javascript делается при помощи вызова методов различных объектов.

Объекты создаются функциями-конструкторами при помощи директивы new.

Вы можете почитать о них подробнее в разделе Объекты, ООП

Массивы

В javascript есть два основных способа объявить массив.

Для массива с числовыми индексами обычно используется объект типа Array.

1 arr = new Array("my", "array")

2 alert(arr.length) // 2

Свойство length содержит длину массива, которая всегда равна последнему индексу (в примере выше - это 1) плюс один.

Обычно используется другая, почти эквивалентная, запись массива, использующая квадратные скобки:

1 arr = [ "my", "array" ]

2 alert(arr[0]) // "my" <- нумерация от нуля

Новые элементы можно добавить в конец методом push.

Для перебора значений используется цикл for.

1 arr = ["первый", "второй"]

2 arr.push("третий")

3

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

5 alert(arr[i])

6 }

Более подробно массивы с числовыми индексами рассмотрены в статье Массивы .

Ассоциативные массивы

Для массивов, ключи которых являются строками, используется Object.

Следующая запись задает ассоциативный массив с ключами n и str:1 obj = {

2 n: 1,

3 str: "Вася"

4 }

Для получения свойства объекта используется оператор-аксессор: точка либо квадратные скобки.

1 obj = { n: 1, str: "Вася" }

2

3 alert(obj.n) // точка

4 alert(obj["n"])

Квадратные скобки позволяют получать свойство по переменной-ключу. var key = "str"

alert(obj[key])

Точка используется, если имя свойства точно известно. Вызов obj.key вернет свойство по имени "key", а квадратные скобки - по значению, которое содержится в переменной key.

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

1 a = { } // пустой объект

2 alert(a.something) // undefined

3 alert(a.blabla === undefined)

Среда разработки Macromedia Dreamweaver 8.0

Dreamweaver - программа для создания Web-страниц. Ее возможности шире по сравнению с обычными функциями подобных редакторов. Dreamweaver позволяет создавать объекты и страницы с использованием языка DHTML, поддерживает каскадные таблицы стилей, а также слои и действия javascript. Разработчику Web-проекта предлагаются гибкий и мощный инструментарий управления сайтом, включая встроенный полноценный FTP-клиент, визуальные карты сайтов и контроль над ссылками. Macromedia Dreamweaver 8 представляет собой комбинацию средств для создания визуального оформления, функций разработки приложений, поддержку редактирования кода, позволяя дизайнерам и разработчикам эффективно создавать визуально привлекательные, основанные на стандартах сайты и приложения.

Подробнее:

В основе этого редактора лежит принцип "Мы не трогаем ваш код". То есть, если взять корректный HTML, открыть его и затем сохранить, он останется неизменным. Работает в паре с редакторами типа Homesite (т.е. отслеживает и загружает новую версию открытого документа если он был изменен другой программой). Программа хорошо работает со скриптами, может оптимизировать страницы для разных браузеров, умеет проверять ссылки и аплоадить отредектированные страницы на сайт. Новые возможности Dreamweaver значительно облегчают процесс создания страниц и управления сайтом.

Профессиональный инструмент для создания web-сайтов и приложений. Впервые художники, дизайнеры и программисты могут работать в единой мощной среде, предназначенной для проектирования, разработки и администрирования профессиональных web-сайтов и приложений. Macromedia Dreamweaver MX объединяет признанные средства визуальной разметки с функциями быстрой разработки web-приложений Dreamweaver UltraDev и мощными возможностями редактора Macromedia HomeSite, а также легко интегрируется с Flash. Лучший в мире инструмент для создания web-сайтов теперь полностью отвечает ожиданиям пользователей, помогая в построении ярких, интерактивных и эффективных интерфейсов.

Полный контроль над внешний видом и деталями реализации приложений. Повышайте продуктивность, используя новую интегрированную рабочую среду, общую с Macromedia Flash и Macromedia Fireworks, которая включает снабженные закладками окна документов, перемещаемые инструментальные панели и встроенное окно просмотра файлов. " Ускорьте процесс разработки, используя профессиональные образцы кода и шаблоны дизайна, в том числе примеры структуры сайтов, формы, а также готовые функции javascript для интерактивного взаимодействия на стороне клиента. Мастер настройки сайтов поможет быстро задать конфигурационную информацию для динамических сайтов, внутренних рабочих сайтов и сайтов, расположенных у Интернет-провайдеров (ISP). " Пишите код быстрее, чем когда-либо раньше, используя такие мощные инструменты, как подсказки по синтаксису, редакторы тегов, гибкое цветовое выделение, средства выбора тегов и вставки готовых фрагментов, а также функции проверки кода.

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

Используйте единую интегрированную среду разработки для создания сайтов на основе HTML, XHTML, XML, ASP, ASP.NET, JSP, PHP или Macromedia ColdFusion. Настраивайте и совершенствуйте среду разработки с помощью более 700 расширений, свободно распространяемых через сайт Macromedia Exchange for Dreamweaver. " Разрабатывайте стандартные web-приложения в кратчайшие сроки, используя библиотечный код для работы с базами данных и обновления web-форм, навигации в наборах записей или аутентификации пользователей. Тестируйте готовые страницы с использованием реальных данных. " Воспользуйтесь преимуществами ColdFusion для быстрой разработки web-приложений. Новичкам помогут мастера создания сайтов, примеры кода и справочные материалы. Профессиональные разработчики на платформе ColdFusion могут воспользоваться такими новейшими возможностями, как модули ColdFusion Components, web-службы, а также встроенные средства отладки и трассировки.

Используйте преимущества новых стандартов и технологий Интернета. Используйте возможности XML, web-служб и XHTML для обновления существующих сайтов и создания приложений нового поколения. Используйте кросс-платформную универсальную среду разработки с поддержкой стандартов J2EE и .NET и работающую на платформах Windows и Macintosh. Воспользуйтесь преимуществами интеграции с лучшими инструментальными пакетами: Macromedia Flash MX и Fireworks MX. " Сократите сроки разработки приложений нового поколения благодаря поддержке XML, включающей возможность создания, редактирования и проверки XML-кода, а также импорта XML-схем. Инспектируйте web-службы на основе XML. Используйте для проверки web-служб на соответствие стандартам генерацию XHTML, удобное преобразование из HTML в XHTML и расширенную поддержку каскадных таблиц стилей CSS2. " Создавайте сайты, содержание которых доступно всем категориям пользователей. Применяйте инструменты проверки соответствия установленным требованиям для тестирования доступности и удобства использования отдельных web-страниц, web-сайтов, справочной системы и интерактивного интерфейса web-разработки для авторов.

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