CC BY
29
Язык JavaScript и связанные с ним программные технологии в подготовке бакалавров физико-математического образования
Д.А. Грамаков, Московский государственный областной университет,
профессор, gramakov@gmail. com
Бакалавры и магистры физико-математического образования, направление информатика, являются теми специалистами, которые определят и будут определять развитие информатизации в системе образования и не только в ней. От их профессиональной подготовки зависит уровень сформированных компетенций в области информационно-коммуникационных технологий (ИКТ) у учащихся общеобразовательных школ, которые в будущем станут специалистами в данной области. Школа должна закладывать фундамент компетенций в области ИКТ не только для учащихся, которые выберут ИКТ в качестве основного направления своей дальнейшей деятельности, но и для всех учащихся, так как персональные компьютеры и другие устройства (смартфоны, нетбу-ки, планшетные компьютеры), с возможностью беспроводного широкополосного подключения к Интернету, становятся важной составляющей в работе современного специалиста. Интернет и связанные технологии определяют тенденцию развития ИКТ в современном мире. При этом важную роль приобретают веб-технологии и веб-приложения, разработанные на основе этих технологий.
В связи с этой тенденцией и была начата разработка специального курса «Введение в веб-программирование». В качестве основы этого курса был выбран язык программирования JavaScript. Достоинство языка JavaScript, с точки зрения обучающего процесса в школе или в вузе, в том, что его использование не зависит от операционной системы, установленной на компьютере. Таким образом, его могут использовать как сторонники операционной системы Linux, так и пользователи предпочитающие операционные системы Microsoft Windows. Для создания приложений на этом языке необходим только браузер, поддерживающий язык JavaScript. В последнее время наметилась тенденция сравнения браузеров по скорости выполнения кода на JavaScript, при этом время выполнения кода существенно уменьшается, а объем исполняемого кода растет, без потери эффективности отображения веб-страниц. Это также является важным фактором при выборе языка. Изучение данного языка важно также, с методической точки зрения, для будущих
учителей информатики. В учебнике «Информатика и ИКТ» для 8-9 классов автора Быкадорова Ю.А. JavaScript используется в качестве языка программирования, при изучении основ алгоритмизации и программирования. Язык JavaScript также широко используется при разработке современных веб-приложений, которые начинают играть все большую роль в мире ИКТ.
Для того, чтобы студентам получили базовое представление о веб-приложениях и соответствующих технологиях их создания, в разработанный курс «Введение в веб-программирование» были включены следующие основные разделы: Основы языка JavaScript. Объектная модель языка JavaScript. Язык XML и связанные технологии. Document Object Model. Библиотека jQuery. Технология Ajax. Обзор языка HTML5.
При изучении основ языка JavaScript главное внимание уделяется тем отличиям, которые имеются в нем по сравнению с такими языками, как Java, Visual Basic и C#. Первые два языка изучаются в отдельных курсах и обучаемые знают основные характеристики данных языков. В частности, рассматриваются основные типы данных и отличия типов undefined и null. Уделяется внимание явному и не явному описанию переменных, области видимости переменных. Объясняется, не смотря на то, что неявное описание является проще, его не рекомендуется использовать, так неявная переменная является глобальной переменной, даже если она описана внутри функции (расходование памяти) и такой стиль программирования, приводит к трудно читаемому коду. При изучении операций, показываются отличия используемых знаков операций по сравнению с другими языками. Рассмотрение операторов управления и цикла сводится к повторению основных конструкций данных операторов, реализуемых в большинстве языков программирования, особое внимание уделяется операторам with и for ... in, которым в базовых курсах программирования в не всегда уделяется должное внимание. В этом разделе рассматриваются функции и массивы, которым также уделяется внимание в разделе «Объектная модель языка JavaScript». Студенты знакомятся с регулярными выражениями. Это понятие не изучается в базовых курсах программирования, так как в них редко рассматриваются задачи связанных с обработкой текста. В программировании на языке JavaScript, одной из базовых задач является обработка текстовых данных (проверка вводимых в формы данных, изменение содержимого веб-страниц, работа с URL-адресом). По этому, регулярным выражениям изучаются и используются при решении практических задач. В государственном образовательном стандарте для бакалавров отсутствуют дисциплины, в которых изучаются язык HTML и каскадные таблицы стилей CSS. О языке HTML студенты обычно имеют некоторое представление, но каскадные таблицы стилей практически им не из-
вестны. Последнее связано с тем, что в школах, если и изучается, то только язык HTML, при этом достаточно формально. Учащиеся знакомятся с базовыми тегами языка, но совсем не имеют понятия о том, что описание разметки и обработка разметки должны быть разделены. Поэтому HTML и CSS уделяется определенное внимание. Изложение строится на понятии «элемент», а не тег. При этом, при рассмотрении конкретных элементов, внимание уделяется на их атрибуты. Атрибуты элементов важны при программировании на языке JavaScript, так как позволяют управлять элементами. Изучение CSS связано тем, что наиболее интересная библиотека jQuery для программирования на языке JavaScript использует базовые понятия каскадных таблиц стилей в своей модели, а также с возможность управления отображением HTML-документов посредством взаимодействия CSS и JavaScript. В виду того, что материал по каскадным таблицам стилей обширен, изучение части материала вынесено на самостоятельную работу студентов.
Изучение второго раздела связанного с объектно-ориентированным программированием начинается с повторения основ классической модели ООП (наследование, инкапсуляция, полиморфизм, класс, объект, метод, свойство). В этой модели базовым понятием является объект, формируемый на основе некоторого класса. В языке JavaScript используется другая модель ООП, основанная на прототипах и называемая наследованием прототипов. В этом языке нет понятия класса, но имеется возможность создавать новые типы объектов и изменять существующие объекты в любое время. Конструктор объекта может наследовать методы другого объекта, создав прототип объекта, на основе которого строятся все остальные новые объекты. Каждый объект имеет свойство prototype, указывающее на прототип, задающий структуру объекта. Данная модель рассматривается с помощью примеров программного кода, демонстрирующих основные ее возможности. Дается краткая характеристика четырех типов объектов имеющихся в JavaScript: пользовательские, встроенные, объекты браузера и объекты документа. С особенностями объектной модели браузера и объектной модели документа, а также с их реализациями в различных браузерах студенты знакомятся самостоятельно.
Третий раздел курса посвящен изучению языка XML и связанных с ним технологий. Не смотря на то, что этот раздел в курсе носит вспомогательный характер, знание основ языка XML является очень важным для специалистов в области ИКТ. Данный язык находит самое широкое применение в различных направлениях развития информационных и коммуникационных технологий. Изучение этого языка строится на основе формирования базовых понятий - элемент, атрибут элемента, примитив, определение типа документа, раздел CDATA, пространство
имен, структура документа. Эти понятия позволяют студентам, по новому, взглянуть на язык HTML, понять разницу между языками HTML и XHTML, роль множества языков разметки, созданных на основе языка XML. Кроме языка XML, студенты кратко знакомятся с XML-схемами и языком XSLT.
Раздел курса посвященный объектной модели документа (DOM) является очень важным, так как эта модель является стандартизированным интерфейсом программирования, обеспечивающим обработку XML и HTML документов. Используя DOM, можно добавлять HTML-элементы, заменять их, находить нужные элементы, управлять стилем документа. В этой модели HTML-документ представляется в виде дерева узлов, имеющих свойства и методы, которые описаны в спецификациях по модели DOM, разработанных консорциумом W3C. Студенты знакомятся с базовыми методами и свойствами, позволяющими осуществлять доступ к узлам документа, вставку узлов, создание узлов, удаление и замену узлов и т.п. При изучении данного раздела, важную роль играют практические задания, выполняемые студентами. В этом разделе, студенты также знакомятся с основами обработки событий внутри браузеров.
Изучение библиотеки jQuery занимает центральное место в курсе. Она находит самое широкое применение в создании веб-приложений, в частности, ее поддержка включена в Microsoft Visual Studio 2010, одну из ведущих сред для создания веб-приложений. Популярность данной библиотеки связана с тем, что она предлагает упрощенный способ доступа к объектной модели документа с помощью механизма селекторов. К достоинствам данной библиотеки относится возможность скрыть недостатки браузеров по реализации веб-стандартов и использовать унифицированный подход к созданию веб-приложений. Изучение материала данного раздела начинается с краткого обзора библиотек, разработанных для языка JavaScript. У студентов формируется понимание того, что библиотеки, разработанные после 2005 г. стали началом нового этапа в развитии языка JavaScript. Он получил второе рождение, став языком позволяющим создавать мощные веб-приложения на стороне клиента. Студентам, в качестве материала для самостоятельной работы, предлагается исследовать содержании книг по языку JavaScript, изданных в период до 2005-2006 г. и после, и проанализировать происшедшие изменения. Такое исследование может быть произведено, так как большинство мировых издательств публикую на своих сайтах документы, содержащие оглавление, изданных книг. Далее в этом разделе студенты знакомятся с селекторами каскадных таблиц стилей, дополнительными селекторами, реализованными в библиотеке и методами обхода дерева DOM. К важным вопросам этого раздела курса относятся возможность
расширения и дополнения базового механизма обработки событий средствами библиотеки, использование визуальных эффектов, реализованных в библиотеке, работа с таблицами и формами, модули расширения стандартной библиотеки. В практических заданиях по данному разделу, сначала решаются элементарные задачи по использованию базовых селекторов, требующие не больших временных затрат, потом задачи усложняются и для их решения, используется весь спектр возможностей библиотеки jQuery
Раздел курса, посвященный изучению технологии Ajax, знакомит с основами разработки насыщенных веб-приложений, имеющих высокую скорость взаимодействия с пользователем и асинхронный способ передачи данных между клиентом и сервером. Технология Ajax стала отправной точкой, которая изменила роль языка JavaScript в современном веб-программировании. Студенты знакомятся со схемой передачи данных при работе традиционного веб-приложения и приложения, использующего технологию Ajax, объектом XMLHttpRequest играющим определяющую роль в технологии Ajax, форматами данных, передаваемых между клиентом и сервером, Ajax-оболочками, способствующими более качественному написанию кода Ajax-приложений, особенностью использования библиотеки jQuery при создании Ajax-приложений. Они также знакомятся с особенностью использования технологии Ajax в среде Visual Studio, при создании веб-приложений. В качестве задания по самостоятельной работе, студентам предлагается изучить особенности использования технологии Ajax и языка PHP.
В последнем разделе курса рассматривается язык HTML5. Основное назначение этого раздела, связать настоящее веб-разработок с возможным будущим этих разработок. Этот язык пока не является стандартом и находится в стадии разработки, но о важности этого языка в мире веб-приложений, говорит такой факт, что уже в настоящее время последние версии основных браузеров (FireFox, Opera, Chrome, Internet Explorer) поддерживают те или иные возможности этого языка. Студенты знакомятся с основными идеями, положенными в основу этого языка, теми новыми элементами, которые предполагается ввести в этот язык и теми элементами, которые уже реализованы в основных браузерах. В практической работе используются последние версии основных браузеров и библиотека Modernizr, написанная на языке JavaScript и позволяющая определять наличие реализации новых возможностей языка HTML5 в том или ином браузере. В качестве задания по самостоятельной работе студентам предлагается исследовать уровень поддержки языка HTML в основных браузерах, а также в браузере Safari.
Данный курс был впервые прочитан в 2009-2010 учебном году бакалаврам физико-математического образования, специализация информа-
тика, обучающимся на четвертом курсе физико-математического факультета Московского государственного областного университета. В настоящее время читается измененная версия курса, в которой учтен опыт проведения практических и лекционных занятий предыдущего курса и учтены изменения, происшедшие в рассматриваемых в курсе технологиях. В частности, больше внимания уделяется практическим заданиям по использованию библиотеки jQuery, работе c языком HTML5, так как за прошедший год он получил большую поддержку в браузерах. В будущем, в данный курс предполагается включить вопросы, связанные с созданием веб-интерфейсов, повышающих функциональность веб-приложений, знакомство с другими библиотека для языка JavaScript и методами их интеграции с библиотекой jQuery, больше внимания уделить подходу, реализованному компанией Microsoft по разработке приложений на основе технологии Ajax и библиотеки jQuery.
