Обекти в JavaScript
Обект – начин за моделиране на нещо реално, въпреки че самия обект е абстрактна величина.
Създаване на обекти – именуването на обектите става по същите правила като на променливите; можем да създадем обекти или чрез използването на функция конструктор или посредством обектен инициализатор.
1. Функции конструктори
function car(seats,engine,theradio) //дефинира се функцията конструктор
{this.seats=seats;
this.engine=engine;
this.theradio=theradio;
//стойностите на параметрите се присвояват на свойствата на обекта
}
var work_car=new car("cloth","V-6","Tape Deck");
/*създава се инстанция на обекта, като се подават параметри, които ще бъдат използвани като стойности на свойствата;*/
var engine_type=work_car.engine;
/*свойството на новата инстанция на обекта се присвоява на независима променлива*/
Пример:
Да се изведат свойствата, които бихме желали да притежава една специална кола, като използваме характеристики от различните типове коли.
<HTML>
<HEAD>
<TITLE>...</TITLE>
/*частта от скрипта с конструкторната функция, създаването на инстанциите и присвояванията на променливи се поставя в HEAD секцията, за да се изпълни първа*/
<SCRIPT language="JavaScript">
<!--
function car(seats,engine,theradio)
{this.seats=seats;
this.engine=engine;
this.theradio=theradio;
}
var work_car=new car("cloth","V-6","Tape Deck");
var fun_car=new car("leather","V-8","CD Player");
var engine_type=work_car.engine;
var seat_type=fun_car.seats;
var radio_type=fun_car.theradio;
//-->
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT language="JavaScript">
<!--
document.write("I want a car with "+seat_type+" seats.<BR>");
document.write("It also needs a "+engine_type+" engine.<BR>");
document.write("Oh,and I would like a "+radio_type+" also.");
/* document.write конструкциите се използват в <BODY> секцията и затова ще изведат съдържанието си в страницата*/
//-->
</SCRIPT>
</BODY>
</HTML>
Може да се създаде нова инстанция чрез използване на стойностите на свойства от други инстанции на обекта:
car(fun_car.seats,work_car.engine,fun_car.theradio);
Можем да променяме стойността на дадено свойство на един обект, присвоявайки му нова стойност.
Пример:
Да се проследи как промяната на стойностите влияе на скрипта.
<HTML>
<HEAD>
<TITLE>...</TITLE>
<SCRIPT language="JavaScript">
<!--
function car(seats,engine,theradio)
{this.seats=seats;
this.engine=engine;
this.theradio=theradio;
}
var work_car=new car("cloth","V-6","Tape Deck");
var fun_car=new car("leather","V-8","CD Player");
/*първоначалната стойност на свойството се присвоява на независима променлива*/
var first_engine=work_car.engine;
/*свойството се променя, при което се сменя и неговата стойност при последващо използване*/
work_car.engine="V-4";
var custom_car=new car(fun_car.seats,work_car.engine,fun_car.theradio);
//-->
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT language="JavaScript">
<!--
document.write("At first I wanted a "+first_engine+" engine.<BR>");
document.write("But after thinking about it for a bit:<BR>");
document.write("I want a car with "+custom_car.seats+" seats.<BR>");
document.write("It also needs a "+custom_car.engine+" engine.<BR>");
document.write("Oh, and I would like a "+custom_car.theradio +" also.");
//-->
</SCRIPT>
</BODY>
</HTML>
2. Обектни инициализатори (представлява малко по-кратка конструкторна функция)
име_на_обект={свойство:стойност}
Заместваме име_на_обект с името, което искаме да зададем на нашия обект, свойство – с името, което желаем да използваме за свойството на обекта, а стойност – със стойността на съответното свойство.
Обект, който е създаден чрез инициализатор, представлява готова инстанция на обекта.
Създаване на обекта work_car чрез инициализатор:
work_car={seats:"cloth",engine:"V-6",theradio:"Tape Deck"}
Пример:
Да изпишем всичко, каквото желаем да има в една кола, като използваме тези свойства:
<HTML>
<HEAD>
<TITLE>...</TITLE>
<SCRIPT language="JavaScript">
<!--
//обектите се създават с помощта на инициализатори
work_car=(seats:"cloth",engine:"V-6",theradio:"Tape Deck");
fun_car=(seats:"leather",engine:"V-8",theradio:"CD Player");
//-->
</SCRIPT>
</HEAD>
<BODY>
<SCRIPT language="JavaScript">
<!--
document.write("I want a car with "+fun_car.seats+" seats.<BR>");
document.write("It also needs a "+work_car.engine+" engine.<BR>");
document.write("Oh, and I would like a "+fun_car.theradio+" also.");
//свойствата на обектите се използват в document.write() конструкциите
//-->
</SCRIPT>
</BODY>
</HTML>
Добавяне на методи – методът представлява обръщение към функция, която се явява част от един обект; извиканата функция може да извършва най-разнообразни операции със свойствата на обекта.
Пример:
Да се напише скрипт, извеждащ листинг за всеки вид кола, нейните характеристики и размера на плащанията за колата.
<HTML>
<HEAD>
<TITLE>...</TITLE>
<SCRIPT language="JavaScript">
<!--
function get_payment() //функцията, която се използва като метод
{var the_payment=250;
if (this.seats=="leather") the_payment+=100; else the_payment+=50;
if (this.engine=="V-8") the_payment+=150; else the_payment+=75;
if (this.theradio=="CD Player") the_payment+=35; else the_payment+=10;
return the_payment;
}
/*конструкторната функция, която преобразува функцията get_payment() в метод*/
function car(seats,engine,theradio)
{this.seats=seats;
this.engine=engine;
this.theradio=theradio;
this.payment=get_payment;
}
var work_car=new car("cloth","V-6","Tape Deck");
var fun_car=new car("leather","V-8","CD Player");
var custom_car=new car(fun_car.seats,work_car.engine,fun_car.theradio);
/*създаваме инстанции на обекта, за които ще използваме новия метод:*/
/*върнатата стойност от метода payment() за трите инстанции на обекта се присвоява на три независими променливи*/
var work_car_payment=work_car_payment();
var fun_car_payment=fun_car_payment();
var custom_car_payment=custom_car_payment();
//-->
</SCRIPT>
</HEAD>
lt;BODY>
/*използват се document.write конструкции, за да се създаде списък с колите, техните характеристики и вноските*/
<SCRIPT language="JavaScript">
<!--
document.write("<H2>The information on the cars you requested:</H2>");
document.write("<B>WorkCar:</B>");
document.write(work_car.seats+","+work_car.engine+", "+work_car.theradio);
document.write("<BR>");
document.write("<B>Payments:</B>S" +work_car_payment);
document.write("<P>");
document.write("<B>FunCar:</B>");
document.write(fun_car.seats+","+fun_car.engine+", "+fun_car.theradio);
document.write("<BR>");
document.write("<B>Payments:</B>S" +fun_car_payment);
document.write("<P>");
document.write("<B>CustomCar:</B>");
document.write(custom_car.seats+","+custom_car.engine+", "+custom_car.theradio);
document.write("<BR>");
document.write("<B>Payments:</B>S" +custom_car_payment);
//-->
</SCRIPT>
</BODY>
</HTML>
Различните свойства на обекта се използват в document.write конструкции, за да се създаде списък с колите, техните характеристики и вноските.
Обект WINDOW
Обектът WINDOW се създава за всеки прозорец, който се показва на екрана.
Свойство Описание
closed Съдържа стойността, която указва дали прозореца е затворен или не
defaultStatus Дефинира подразбиращото се съобщение, което се показва в лентата за състояние
frames Масив, който представя всички фреймове на даден прозорец
length Съдържа стойност, която е равна на броя фреймове в даден прозорец
location Текущия URL адрес на прозореца
name Позволява да се даде име на прозореца
opener Отнася се за прозореца, който е отворил друг прозорец
parent Отнася се за набора фреймове, към което принадлежи текущия фрейм
self Друг начин за обръщение към текущия прозорец
status Позволява да се постави съобщение в лентата за състояние; предефинира defaultStatus
top Референция към най-горния прозорец, съдържащ фрейм, набор фреймове или вмъкнат набор от фреймове
Метод Описание
alert() Извежда прозорец с предупреждение. Потребителят трябва да щракне върху бутона OK, за да продължи нататък
confirm() Показва прозорец за потвърждение. Потребителя трябва да щракне върху бутона OK или Cancel, за да продължи нататък
find() Позволява на потребителя да включи помощното средство Find, за да търси даден текст в страницата
print() Отпечатва съдържанието на даден прозорец
prompt() Извежда промпт, с който иска от потребителя да въведе информация
open() Отваря нов прозорец на браузъра
close() Затваря прозорец на браузъра
blur() Премахва фокуса от даден прозорец
focus() Дава фокуса на даден прозорец
moveBy() Премества прозореца с даден брой пиксели, които са подадени като параметри
moveTo() Премества горния ляв ъгъл на прозореца до координатите, които са подадени като параметри
resizeBy() Преозмерява прозореца, като премества долния ляв ъгъл с даден брой пиксели, които са подадени като параметри
resizeTo() Преозмерява целия прозорец според ширината и височината, които са подадени като параметри
scrollBy() Скролира видимата област на прозореца с определен брой пиксели, които са подадени като параметри
scrollTo() Скролира видимата област на прозореца към определени координати, които са подадени като параметри
setInterval() Извиква дадена функция на определен период от време
clearInterval() Прекратява действието на setInterval()
setTimeout() Извиква еднократно дадена функция след изтичането на определен период от време
clearTimeout() Прекратява действието на clearTimeout()
Пример:
<HTML>
<HEAD>
<SCRIPT language="JavaScript">
<!—
function go_there()
{var thename=document.myform.yourname.value;
if (thename=="John")
window.location=" http://www.pageresource.com";
else
window.location="http://www.yahoo.com";}
/*проверява стойността на променливата и според нея изпраща потребителя към една или друга страница*/
//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM name="myform">
Your name:
<BR>
<INPUT type="text" name="yourname" SIZE="25">
<P>
<INPUT type="button" value="Click for your page!" onClick="gothere();">
/*функцията се извиква, когато потребителя щракне върху бутона*/
</FORM>
</BODY>
</HTML>
Пример:
<HTML>
<HEAD>
<SCRIPT language="JavaScript">
<!—
function go_there()
{var is_sure=window.confirm(Are you sure you want to leave?);
if (is_sure==true)
{window.location="http://www.yahoo.com";}
}
//-->
</SCRIPT>
</HEAD>
<BODY>
<FORM>
<INPUT type="button" value="Click to Search the Web" onClick="go_there();">
/*функцията стартира прозореца за потвърждение*/
</FORM>
</BODY>
</HTML>
Пример:
<FORM>
<INPUT type="button" value="Click to Find Text" onClick="window.find();">
/*търси определен текст в страницата*/
</FORM>
Пример:
<FORM>
<INPUT type="button" value="Click fo Print Page" onClick="window.print();">
/*отпечатва текущия прозорец*/
</FORM>
Обект DOCUMENT
Обектът DOCUMENT е обект, който се създава от браузъра за всяка нова разглеждана HTML страница (документ). Посредством този обект, JavaScript ни дава достъп до няколко свойства и методи, които могат да влияят на документа по различни начини.
Свойствата на обекта DOCUMENT връщат няколко различни типа стойности.
Свойство Описание
alinkColor Връща шестнайсетичната стойност на цвета за активната връзка от документа
anchors Масив от всички именувани котви в документа
applets Масив от всички Java аплети в документа
bgColor Връща шестнайсетичната стойност на цвета на фона на документа
cookie Използва се за задаване на бисквитки в документа
domain Връща името на домейна на сървъра за документа
embeds Масив от всички EMBED тагове в документа
fgColor Връща шестнайсетичната стойност на цвета на текста по подразбиране на документа
formName Само по себе си не е свойство, но създава ново свойство за всяка именувана форма, поставена в документа
forms Масив от всички FORM тагове в документа
images Масив от всички IMG тагове в документа
lastModified Връща датата на последната модификация на документа
layers Масив от всички LAYER тагове в страницата(само за Netscape Nvigator)
all Свойство, което има за цел да даде достъп до всички обекти от страницата (само за Internet Explorer)
linkColor Връща шестнайсетичната стойност на подразбиращия се цвят на връзка от документа
links Масив от всички тагове за връзки в документа
plugins Масиви от всички Plug-in модули, използвани в документа
referrer Връща Web адреса (URL адреса) на документа, който е отправил потребителя към текущия документ
title Връща текста, използван в TITLE таговете на текущия документ
URL Връща URL адреса на текущия документ
vlinkColor Връща шестнайсетичната стойност на цвета за посетена връзка в документа
Метод Описание
open() Отваря нов документ, което ви позволява да напишете неговото съдържание чрез write() или writeln() методи
close() Затваря нов документ, който е бил отворен чрез метода open()
write() Дава ви възможност да изпишете текстов низ в HTML документ
writeln() Позволява да изведете текстов низ в HTML документ, но завършва реда с JavaScript знак за нов ред
Обект MATH
Обектът MATH ни предоставя методи и свойства, които можем да използваме в математически изчисления.
Свойство Описание
E Стойността на константата на Ойлер (е), която е равна на около 2,71828...
LN10 Стойността на натуралния логаритъм от 10, което е около 2.302585...
LN2 Стойността на натуралния логаритъм от 2, което е около 0,693147...
LOG10E Стойността на логаритъм от Е при основа 10, което е около 0,43429...
LOG2E Стойността на логаритъм от Е при основа 2, което е около 1,442695...
PI Стойността на числото PI, която е около 3,14159...
SQRT2 Стойността на корен квадратен от 2, което е около 1,4142...
SQRT1_2 Стойността на корен квадратен от 1/2, което е около 0,7071...
Метод Описание
abs() Връща абсолютната стойност на числото, което е подадено като параметър
acos() Връща аркус косинус от подаденото като параметър число, в радиани
asin() Връща аркус синус от подаденото като параметър число, в радиани
atan() Връща тангенс косинус от подаденото като параметър число, в радиани
ceil() Връща най-малкото цяло число, което е по-голямо или равно на подаденото като парамерър число
cos() Връща косинус от подаденото като параметър число, в радиани
exp() Връща стойността на числото Е на степен подаденото като параметър число
floor() Връща най-голямото цяло число, което е по-малко или равно на подаденото като параметър число
log() Връща натуралния логаритъм на подаденото като параметър число
max() Връща по-голямото от двете числа, които са подадени като параметри
min() Връща по-малкото от двете числа, които са подадени като параметри
pow() Връща стойността на първия параметър на степен стойността, подадена като втори параметър
random() Връща случайно число между 0 и 1; не изисква параметър
round() Връща закръглената стойност на подаденото като параметър число
sin() Връща синус от подаденото като параметър число, в радиани
sqrt() Връща корен квадратен от подаденото като параметър число
tan() Връща тангенс от подаденото като параметър число, в радиани
Обект DATE
Обектът DATE ни предоставя методи и свойства, които можем да използваме за работа с дати и време.
Свойство Описание
constructor Съдържа стойността на конструкторната функция, която е създала обекта
prototype Дава възможност, ако желаем, да добавим свойства към обекта
Метод Описание
getDate() Връща деня от месеца според локалното време на потребителя
getDay() Връща деня от седмицата (0-6) според локалното време на потребителя
getHours() Връща броя часове (0-23) в деня според локалното време на потребителя
getMinutes() Връща броя минути (0-59) в часа според локалното време на потребителя
getMonth() Връща номера на месеца (0-11) в годината според локалното време на потребителя
getSeconds() Връща броя секунди (0-59) в минутата според локалното време на потребителя
getTime() Връща числова стойност на времето според локалното време на потребителя
getTimezoneOffset() Връща отклонението на времевата зона в минути според локалното време на потребителя
getYear() Връща годината (две цифри) според локалното време на потребителя
getFullYear() Връща годината (четири цифри) според локалното време на потребителя
parse() Връща броя милисекунди, които са изтекли от полунощ 1 януари 1970 до датата, която е подадена като параметър, според локалното време на потребителя
setDate() Задава деня от месеца за дадена инстанция на обекта Date
setHours() Задава броя часове за дадена инстанция на обекта Date
setMinutes() Задава броя минути за дадена инстанция на обекта Date
setMonth() Задава месеца за дадена инстанция на обекта Date
setSeconds() Задава секундите за дадена инстанция на обекта Date
setTime() Задава времето (в милисекунди от полунощ 1 януари 1970) за дадена инстанция на обекта Date
setYear() Задава годината (две цифри) за дадена инстанция на обекта Date
setFullYear() Задава годината (четири цифри) за дадена инстанция на обекта Date
toGMTString() Връща низ, представящ датата в Greenwich Mean Time (GMT) формат
toLocaleString() Връща низ, представящ датата според локалния формат

