Опубликован: 04.07.2012 | Уровень: специалист | Доступ: платный
Лекция 5:

JavaScript - язык разработки клиентских веб-приложений

< Лекция 4 || Лекция 5: 12 || Лекция 6 >
Аннотация: Цель лекции: знакомство с основным языком разработки клиентских веб-приложений - JavaScript, его структурой и основами синтаксиса. Показать, каким образом объектная модель, заложенная в JavaScript, позволяет создавать интерактивные приложения. Знакомство с языком регулярных выражений.

JavaScript - интерпретируемый язык программирования, стандартизированный международной организацией ECMA в спецификации ECMA-262. Языки JavaScript, JScript и ActionScript являются расширением стандарта ECMA-262.

Название "ECMAScript" явилось фактически компромиссом между организациями, вовлеченными в процесс стандартизации, в частности Netscape и Microsoft. Хотя JavaScript и JScript стремились к совместимости с ECMAScript, они имеют ряд дополнительных возможностей не предусмотренных спецификацией ECMA.

Синтаксис JScript во многом аналогичен языку JavaScript, однако, помимо добавления клиентских скриптов на веб-страницы и некоторых других функций, JScript может использоваться и для других целей, например:

  • автоматизация администрирования систем Microsoft Windows;
  • создание страниц ASP.

Язык JScript получил дальнейшее развитие в виде языка JScript.NET, который ориентирован на работу в рамках платформы Microsoft.NET

JavaScript - интерпретируемый, объектно-ориентированный язык. Хотя он имеет существенно меньшее количество возможностей, чем такие объектно-ориентированные языки как C++ и Java.

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

Java JavaScript
использует парадигму ООП из C++ использует прототипный подход
имеет статическую типизацию имеет динамическую типизацию (значение переменной может содержать объекты любого типа и даже функции)
загружается из скомпилированного байт-кода интерпретируется напрямую из файла.

Структура языка

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

  • ядро (ECMAScript),
  • объектная модель браузера (Browser Object Model),
  • объектная модель документа (Document Object Model или DOM).

Ядро

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

Объектная модель браузера

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

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

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

Объектная модель документа

Объектная модель документа - интерфейс программирования приложений для HTML и XML-документов. Согласно DOM документу можно поставить в соответствие дерево объектов, обладающих рядом свойств, которые позволяют производить с ним различные манипуляции:

  • получение узлов,
  • изменение узлов,
  • изменение связей между узлами,
  • удаление узлов.

Основы JavaScript (ECMAScript)

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

  • язык не позволяет разрабатывать самостоятельные приложения;
  • сценарии на JavaScript могут выполняться только при помощи интерпретатора, в частности веб-браузером.
  • JavaScript - язык без строгого контроля типов. Поэтому не требуется объявлять тип переменных явно. Кроме того, во многих случаях JavaScript исполняет преобразования автоматически, когда они необходимы. Например, при сложении строки и числа, число будет преобразовано в строку.

Код на JavaScript пишется в текстовом формате, и организован в инструкции, блоки, состоящие из связанных наборов инструкций, и комментариев. В пределах инструкции можно использовать переменные и данные, такие как строки, числа и выражения. Для объявления конца инструкции используется точка с запятой ;. Группа JScript-инструкций, заключенная в фигурные скобки {}, называется блоком.

Комментарием в JavaScript является текст, расположенный после // до конца строки. Многострочный комментарий начинается с /*, и заканчивается */.

Знак равенства (=) используется в JavaScript как присваивание. Следующий код

Pi = 3.14;

подразумевает "Присвоить значение 3.14 переменной Pi".

При сравнении двух значений на равенство применяется двойной знак равенства (==).

JavaScript выражения можно разделить на логические или числовые. Выражения содержат некоторые особенности, к примеру, символ "+" означает "добавить к...". Любая допустимая комбинация значений, переменных, операторов, и других выражений является выражением.

Объявление переменной перед использованием является необязательным. Для этого используется инструкция var. Инструкция var является обязательной при объявлении локальной переменной внутри функции. Разрешается объявление переменной неявно - без инструкции var. Однако, в выражениях применять необъявленные переменные не допускается. JavaScript различает регистр в имени переменной. Name и name рассматриваются как различные переменные.

Типы данных

JavaScript - язык с нестрогим контролем типов, переменные в JavaScript не имеют строго фиксированного типа. Переменные имеют тип, эквивалентный типу значения, которое они содержат. Однако, в некоторых случаях, необходимо принудительное преобразование переменной в определенный тип. Числа могут быть объявлены как строки, а строки необходимо преобразовать в числовой тип. Для этого применяют функции parseInt() и parseFloat().

В JavaScript используется шесть типов данных. Основные из них - числа, строки, объекты, логический. Остальные два - null и undefined (т.е. неопределенный).

Строки объявляются при помощи двойных кавычек или апострофов. Строка может состоять из нуля или более символов unicode. Когда количество символов равно нулю, это называется пустой строкой ("").

JavaScript поддерживает числа как целые, так и с плавающей запятой. Также существуют специальные представления чисел, например NaN (не число).

Примеры чисел:

3.14 // Вещественное число
15 // Целое число
0177 // Восьмеричное число 177
0XA8    // Шестнадцатиричное число A8

Логический тип допускает значения - true и false. Любое выражение, равное 0, считается эквивалентным false, а любое выражение, равное числу, отличному от 0 будет эквивалентным true.

Undefined - означает, что тип не определен. Значение undefined имеет переменная после ее объявления и до присвоения ей какого-либо определенного значения.

Переменная типа null - не имеет никакого определенного значения.

Операторы

Язык поддерживает условные выражения if и if...else. При использовании нескольких условий одновременно можно использовать операторы ||(ИЛИ ) или && (И).

В JavaScript существует несколько типов циклов: for, for...in, while, do...while и switch. Также существует инструкция остановки выполнения цикла. Оператор завершения break может применяться для того, чтобы остановить цикл, при выполнении какого-либо условия. Инструкция continue используется, чтобы немедленно перейти к выполнению следующей итерации, пропуская остальную часть выполнения кода текущей итерации, но обновляя переменную-счетчик.

Функции

В JavaScript имеется два вида функций: встроенные и определяемые. Программист имеет возможность создавать собственные функции. Определение функции состоит из объявления параметров и блока инструкций JavaScript.

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

function имя (аргументы) 
{
  операторы
}

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

Пример:

function area(radius) 
{
  return   pi* radius *  radius;
}

Эта функция называется area и имеет один формальный аргумент radius. При вызове этой функции вместо формального аргумента подставляется его фактическое значение, функция вычисляет площадь круга на основе этого значения и возвращает полученное число через оператор return.

Переменные, декларированные в теле функции, являются локальными, т. е. недоступны вне ее тела.

При вызове функции в JavaScript действуют следующие правила передачи аргументов функции:

  • Аргументы примитивных типов передаются функции по значению.
  • Объекты (и встроенные, и определенные пользователем) передаются по ссылке. Это означает, что все изменения свойств объекта в теле функции производятся непосредственно в самом объекте, а не в его локальной копии и, следовательно, сохраняются после возврата из функции.

В JavaScript функция выступает в качестве одного из основных типов данных. Одновременно с этим в JavaScript определен класс объектов Function.

В общем случае любой объект JavaScript определяется через функцию. Для создания объекта используется конструктор, который в свою очередь вводится через Function. Таким образом, с функциями в JavaScript связаны следующие ключевые вопросы:

  • функция как тип данных;
  • функция как объект;
  • функция как конструктор объектов.

Объекты

Объект - это главный тип данных JavaScript. Объекты в JavaScript, по-сути, являются совокупностями методов и свойств.

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

Сценарии JavaScript могут использовать объекты следующих видов:

  • клиентские объекты, входящие в модель DOM, т.е. отвечающие тому, что содержится или происходит на Web-странице в окне браузера. Они создаются браузером при разборе (парсинге) HTML-страницы. Примеры: window, document, location, navigator и т.п.
  • серверные объекты, отвечающие за взаимодействие клиент-сервер.
  • встроенные объекты, представляющие различные типы данных, свойства, методы, присущие самому языку JavaScript, независимо от содержимого HTML-страницы. Примеры: Array, String, Date, Number, Function, Boolean, Math.
  • пользовательские объекты, которые создаются программистом в процессе создания сценария с использованием конструкторов типа объектов (класса).

Операторы работы с объектами

Оператор for (переменная in объект) позволяет перебрать все свойства объекта. Например:

for (d in document)
  document.write("document."+d+" = <b>"+ 
          document[d]+"</b><br>");

Обработка объектов и массивов идентична. Можно обратиться к любой части объекта (его свойствам и методам) либо по имени, либо по индексу.

< Лекция 4 || Лекция 5: 12 || Лекция 6 >
Сергей Крупко
Сергей Крупко

Добрый день.

Я сейчас прохожу курс  повышения квалификации  - "Профессиональное веб-программирование". Мне нужно получить диплом по этому курсу. Я так полагаю нужно его оплатить чтобы получить диплом о повышении квалификации. Как мне оплатить этот курс?

 

Галина Башкирова
Галина Башкирова

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

Системный администратор информационно-коммуникационных» систем.
Мне нужно самой найти тему? или делать по высланным темам

 

Nat Ves
Nat Ves
Израиль
Татьяна Орлова
Татьяна Орлова
Россия, Воронежская область