Научно-методическая конференция
«ИНТЕРНЕТ И СОВРЕМЕННОЕ ОБЩЕСТВО»

ИНТЕРАКТИВНЫЙ ЛАБОРАТОРНЫЙ ПРАКТИКУМ ПО JAVASCRIPT

Р.А. Хадзиев

Ростовский государственный университет
Ростов-на-Дону

Дистанционный лабораторный практикум по JavaScript является частью Web-учебника по JavaScript для начинающих. Ранее был разработан интерактивный Web-учебник по HTML для начинающих c циклом лабораторных работ.

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

Основными элементами интерфейса анализатора являются окно ввода, кнопка запуска скрипта, окно вывода (нижний фрейм) результата работы скрипта, внутренние функции анализатора.

Механизм работы анализатора можно представить следующим образом:

Этап 1. Ввод кода в окно или редактирование уже введенного кода;

Этап 2. Нажатие кнопки запуска скрипта;

Этап 3. Обработка введенного текста (анализ) посредством лексического и логического анализаторов. Если обнаружена ошибка, то выдается сообщение и происходит возврат на этап № 1;

Этап 4. Вывод результата в нижний фрейм, либо выполнение какого-либо действия, предусмотренного скриптом.

С точки зрения реализации средствами HTML, анализатор состоит из трех файлов. Первый, главный файл, описывает фреймы и называется kontrolX.htm, где Х - номер задания (т.е. для третьего задания имя файла будет kontrol3.htm)

Для каждого задания существует свой файл kzX.htm, где Х - номер соответствующего урока. Файл output.html - просто пустой фрейм, он является общим для всех заданий. Основной код анализатора располагается в файле kzX.htm.

Система анализатора построена следующим способом:

1. Считываются данные из формы, содержащей текст скрипта;

2. Каждая строка заносится в отдельный элемент массива;

3. В цикле проверяется синтаксис по всему тексту, т.е. соответствие открывающих и закрывающих скобок, кавычек и т.д. В результате несоответствия выдается сообщение о том, что обнаружены несоответствия в строке Х, позиции Х.

Построчно начинается анализ логики: в строке ищется предполагаемая фраза (например, var, но в данном случае это слово может быть, а может и не быть, это учитывается), после нее ищется следующая предполагаемая фраза ... после последней предполагаемой фразы анализируется остаток строки. Если в нем встречается какой-то символ, кроме пробела и символа перевода строки (в большинстве случаев, допустим символ «;»), то выдается сообщение о том, что обнаружены лишние данные в строке Х, позиции Х. Если в строке нет искомой ключевой фразы, то выдается сообщение о том, что ожидается «ключевая фраза» в строке Х, позиции Х.

Для анализа каждой функции вызывается соответствующая функция testlineX(), например, для первой строки - testline1(), для второй - testline2() и т.д. Каждая функция возвращает true, если в строке не обнаружены ошибки (в данном случае работа анализатора продолжается), либо false, если ошибки обнаружены.

Если все функции вернули true, то вызывается функция output(), которая генерирует html-документ, содержащий текст скрипта, введенного пользователем (этот текст располагается в между тэгами <script> и </script>). Все это выводится в document [1] (т.е. в нижний фрейм).

Найти и ознакомиться с Web-учебником можно на сервере ЮГИНФО РГУ по адресу:

http://public.uic.rsu.ru/~rhadziev/js/index.htm

[Аннотация на английском языке]