return {w:document.documentElement.clientWidth, h:document.documentElement.cliendHeight};
}
if (document.body){
return {w:document.body.clientWidth, h:document.body.clientHeight};
}
return {w:0, h:0}
}
Тремя последними свойствами документа являются title, referer и cookies. document.title и document.referer достаточно понятны. document.title содержит заголовок страницы. Его можно прочитать и изменить после полной загрузки документа. document.referer содержит просто URL страницы, которая привела пользователя на текущую страницу.
Поэтому, если вы щелкнули на ссылке, чтобы попасть на эту страницу, то document.referer будет содержать URL страницы, на которой находится ссылка. Если вы пришли на эту страницу сразу, задавая ее в поле адреса браузера, то document.referer будет неопределен.
Последняя тема этой лекции, переменная cookie, отличается от всего остального в JavaScript. cookie является строкой текста, которую можно сохранить с одной страницы на другой, если вы находитесь на одном и том же сервере. В отличие от других переменных в JavaScript, cookie не стирается при перезагрузке страницы. cookie стираются только через определенный период времени или когда все cookie удаляются в браузере.
cookie читают и записывают через document.cookie. В отличие от других свойств изменение document.cookie в действительности не перезаписывает, а добавляет к cookie. Поэтому, если требуется задать 5 cookie, то каждое из них задается с помощью document.cookie= "...";. Формат cookie имеет свои особенности, поэтому мы рассмотрим несколько функций для выполнения этой задачи:
function writeCookie(name, value, days){
if(days){
(time = new Date()).setTime(new Date().getTime()+days*24*60*60*1000);
var exp = '; expires='+time.toGMTString();
}else{
var exp='';
}
document.cookie=name+"="+value+exp+"; path=/";
}
function readCookie(name){
var cookies = document.cookie.split(';');
for(var i=0; i<cookies.length; i++){
var cookie=cookies[i].replace(/^\s+/, '');
if (cookie.indexOf(name+'=')==0) return cookie.substring(name.length+1);
}
return null;
}
function eraseCookie(name){
writeCookie(name, "", -1);
}
Три эти функции выполняют запись, чтение и стирание cookie на текущей странице. Их можно протестировать с помощью следующего кода:
function addToCounter(){
var counter = readCookie('myCounter');
if(counter){
counter = parseInt(counter);
} else {
counter = 0;
}
writeCookie('myCounter', counter+1, 1);
}
function showCounter(){
alert(readCookie('myCounter'));
}
Если увеличить счетчик cookie несколько раз, обновить страницу, а затем проверить счетчик, то можно увидеть, что он остался таким же, как был до обновления страницы. Эти cookie будут сохранятся до тех пор, пока они не будут удалены из браузера или пока не пройдет 24 часа - cookie заданы на период одни сутки.
Это почти все об объектах окна и документа. В следующей лекции речь пойдет об объектно-ориентированном коде.
Лекция 8. Основы объектно-ориентированного программирования
Почти каждый современный язык программирования имеет некоторый метод записи объектно-ориентированного (ОО) кода. Если вы знакомы с такими языками, как C++, Java, VB, php или подобными, то должны быть знакомы и со структурой Class этих языков.
Классы в этих языках позволяют быстро создавать объекты с одинаковыми свойствами и методами, не требуя при этом заново определять все эти свойства и методы. В терминах структур мы имеем классы, а внутри этих классов - функции и переменные, а внутри каждой из этих функций - дополнительные переменные. Каждая функция в классе идеально работает с переменными и другими функциями, внутренними для этого класса.
Структура Class и объекты в целом хорошо работают потому, что они действуют как реальные объекты. Например, мы можем иметь класс Телевизор. Так как все телевизоры в целом работают одинаково, то нет необходимости переопределять множество атрибутов телевизора, чтобы сделать еще один новый. Этот класс будет определять методы и свойства телевизора. Мы будем иметь такие свойства, как марка, размер экрана, и т.д., и методы, такие, как включить/выключить, сменить канал, и т.д.
JavaScript слегка отличается от стандартной объектно-ориентированной структуры Class. Вместо использования классов для создания объектов, каждая функция в JavaScript может эффективно действовать как класс. Мы используем концепцию вложенных функций, называемую прототипированием (Prototyping), для выполнения таких же вещей, как и языки со структурами Class. Если вы знакомы с ОО-языком на основе классов, то прототипирование может показаться сначала непривычной концепцией, но она предлагает большие возможности и часто является значительно более гибкой с точки зрения программирования, чем другие методы.
Для начала необходимо объяснить, как объекты действуют в JavaScript. Объекты позволяют определить переменную и задать затем для этой переменной любое число свойств. Чтобы понять это, давайте посмотрим на простой пример:
var myObj = new Object;
myObj.a = 5;
myObj['b'] = 10;
myObj.c = 20;
myObj.getTotal = function(){
alert(this.a+this.b+this.c);
};
// или
var myObj = {a:5, b:10, c:20,
getTotaclass="underline" function() { alert(this.a+this.b+this.c); }};
Оба эти фрагмента кода создают одну и ту же переменную myObj. Первый пример использует синтаксис new Object(), а затем определяет все свойства одно за другим. Второй фрагмент кода является сокращенной нотацией, которая делает в точности то же самое. Мы имеем теперь переменную myObj. myObj содержит три переменные для целых чисел: a, b и c. Для доступа к любой из них мы просто используем myObj.a или myObj['a']. Можно видеть, что myObj имеет также в качестве свойства функцию getTotal. Мы обращаемся к getTotal таким же образом, как и к свойствам a, b и c: myObj.getTotal(). Функция getTotal() обращается к переменным в переменной myObj с помощью this. При выполнении кода внутри функции в объекте this ссылается на объект. В данном случае this ссылается на сам объект myObj.