- •Часть I. Язык сценариев JavaScript 3
- •Часть II. Среда клиента 73
- •Часть III. Динамический html 95
- •Клиентское Web-программирование
- •Часть I. Язык сценариев JavaScript Урок 1. Модель клиент-сервер в Интернете Распределенные системы и приложения
- •Http-запрос
- •Http-ответ
- •Урок 2. Сценарии JavaScript в документах html Языки сценариев
- •Язык JavaScript
- •Основные положения синтаксиса
- •Размещение операторов языка на странице
- •Упражнения
- •Урок 3. Переменные и литералы
- •Числовой тип
- •Строковый тип
- •Булевый тип
- •Специальные типы данных
- •Переменные
- •Определение типа переменной
- •Упражнения
- •Урок 4. Выражения и операции
- •Арифметические операции
- •Логические выражения
- •Строковые операции
- •Комбинированные операции присваивания
- •Условная операция
- •Приоритет операций
- •Упражнения
- •Урок 5. Операторы
- •Операторы выбора
- •Операторы цикла
- •Упражнения
- •Урок 6. Функции
- •Упражнения
- •Урок 7. Встроенные объекты (1)
- •Объект Array
- •Объект Date
- •Объект Math
- •Объект String
- •Объект Function
- •Объект Boolean
- •Объект Number
- •Упражнения
- •Урок 8 Встроенные объекты (2) Объект Object
- •Стандартные функции верхнего уровня (объект Global)
- •Манипулирование объектами
- •Обработка ошибок
- •Упражнения
- •Урок 9. Создание собственных объектов
- •Упражнения
- •Часть II. Среда клиента Урок 10. Объектная модель ms Internet Explorer
- •Объект window
- •Объект navigator
- •Объект location
- •Объект history
- •Упражнения
- •Урок 11. Объекты доступа к странице и ее элементам Объект document
- •Объект body
- •Объект form
- •Упражнения
- •Урок 12. Обработка событий в ms Internet Explorer Обработчики событий
- •Вызов процедуры обработки события
- •Событийная модель
- •Объект event (ie)
- •Упражнения
- •Часть III. Динамический html Урок 13. Объектная модель документа dhtml
- •Структура документа
- •Иерархия объектов
- •Свойства и методы объектов
- •Упражнения
- •Урок 14. Примеры динамических страниц html Раскрывающийся список
- •Движущийся элемент
- •Динамическое изменение таблиц
- •Родственные отношения
- •Упражнения
- •Урок 15. Объектная модель документа dom
- •Узлы объектной модели dom
- •Перемещение по объектной модели
- •Изменение объектной модели документа
- •Упражнения
Урок 8 Встроенные объекты (2) Объект Object
Расположен во главе всей иерархии объектов JavaScript. Любой объект JavaScript является наследует все его свойства и методы. Для создания объекта Object используется конструктор Object() с единственным необязательным параметром:
var obj = new Object([значение])
Если параметр конструктора не задан, то создается объект без значения. Если же он задан, то может быть любым из поддерживаемых JavaScript типов данных — числовым, булевым или строковым. Если этот параметр является объектом, то возвращается неизмененным этот же объект (свойство constructor возвращает ссылку на конструктор объекта, а вот операция typeof будет возвращать строку "object", а не строку с типом объекта-параметра). Значения null и undefined этого параметра приводят к созданию объекта без содержимого.
Свойства объекта Object
constructor |
Хранит ссылку на функцию-конструктор, с помощью которой создан экземпляр объекта. |
prototype |
Возвращает ссылку на прототип класса объектов. Изменять прототип встроенных объектов нельзя, тогда как пользовательских можно. Это свойство "класса", а не экземпляра, поэтому оно применяется не к экземпляру объекта, а к его конструктору Object. |
propertyIsEnumerable(имя) |
Логическое свойство, возвращающее true, если указанное в качестве параметра свойство объекта существует и доступно при переборе свойств в цикле for...in. |
Используя свойство constructor, которое наследуется также и всеми объектами JavaScript, можно проверить его принадлежность классу объектов. Сравнивать значение этого свойства надо с конструктором соответствующего объекта (просто имя конструктора). Для пользовательского объекта этим именем является имя соответствующей функции-конструктора (см. урок 9), а для встроенных объектов следующие ключевые слова — String, Date, Function, Array, Boolean, Number, Object:
var str = "xxxxxx";
var obj = new Object();
(str.constructor == String) ? true : false; // true
(obj.constructor == String) ? true : false; // false
(obj.constructor == Object) ? true : false; // true
Свойство prototype позволяет добавлять свойства и методы к "классу" объектов. Оно наследуется также каждым объектом JavaScript (пользовательским или встроенным кроме объектов Global и Math). После добавления свойств и методов к прототипу создание объектов этого класса приводит к тому, что у всех объектов будут существовать добавленные свойства и методы. Так как все объекты "происходят" от объекта Object, то добавление свойств и методов к его прототипу приводит к созданию соответствующих свойств и методов у всех объектов JavaScript.
Пример 10. Добавление свойств и методов ко всем объектам
Добавим к прототипу объекта Object метод, возвращающий строку с названиями и значениями всех свойств объекта.
Для этого прежде всего создадим функцию props(), выполняющую указанное действие. В JavaScript есть специальный цикл for...in, который предназначен для просмотра всех свойств объекта (встроенного или пользовательского). На каждом шаге цикла его переменная хранит имя свойства, а доступ к значению этого свойства можно получить, выполнив для объекта операцию индексации со строковым индексом, равным имени свойства. Например, к свойству constructor объекта obj класса Object можно обратиться не только с использованием точечной нотации obj.constructor, но и с помощью индекса "constructor" следующим образом obj["constructor"]. (Это справедливо для любого объекта JavaScript.)
function props() {
var s = ""
for(var i in this){
s += i + ': ' + this[i] + '<br>';
}
return s;
}
Здесь следует, забегая вперед, пояснить использование ключевого слова this в функциях JavaScript. Оно используется исключительно в функциях, реализующих методы объектов, и имеет смысл "этот объект". Когда добавляется новый метод к прототипу встроенного объекта, то в реализующей его функции следует каким-то образом ссылаться на экземпляр объекта, который впоследствии будет создан. Именно ключевое слово this и реализует эту функциональность. Поэтому в нашей функции props() цикл будет осуществляться по всем свойствам экземпляра объекта, ассоциированный с этой функцией метод которого будет вызываться. А конструкция this[i] будет возвращать значение очередного свойства этого объекта.
Теперь остается добавить новое свойство к прототипу объектов класса Object. Назовем его propList и присвоим ему ссылку на функцию props():
Object.prototype.propList = props;
Обращаем внимание, что присваивается ссылка props на объект Function, а не вызов функции props()!
Создадим объект String:
var s = "*********";
Теперь он имеет метод propList(), и следующий оператор распечатает все свойства объекта s с их значениями в окне браузера:
document.write(s.propList())
Внимание! Метод propList() вызывается как обычная функция. Если бы для выполнения реализующей его функции props() требовались параметры, то их следовало бы передать при вызове метода propList() объекта s.
Не все свойства объектов могут быть перечислены в цикле for...in. Для проверки доступности свойства в указанном цикле у объекта Object (и, естественно, у всех объектов JavaScript) есть логическое свойство propertyIsEnumerable(имя), определяющее доступность свойства в цикле for...in. Имя свойства передается как строка. Исключение — свойства массива, представляющие собой индексы эго элементов. В этом случае имя может быть передано в свойство propertyIsEnumerable как число, и как строка, содержащая число. Заметим, что все добавляемые пользователем к встроенным объектам свойства являются перечисляемые, тогда как их собственные встроенные свойства не все могут быть перечисляемыми.
Методы объекта Object
toString |
Возвращает строку, представляющую заданный объект. |
valueOf |
Возвращает примитивное значение заданного объекта. |
