?аваскрипт или ?аваскрипт (енгл.JavaScript) ?е динамичан, слабо типизиран и интерпретиран програмски ?език високог нивоа. Стандардизован ?е по ЕКМАСкрипт спецификаци?и ?езика. Поред HTML-а и CSS-а, ?аваскрипт ?е ?една од три воде?е технологи?е за дефиниса?е садржа?а на Вебу; ве?ина веб-са?това користи ?аваскрипт а сви модерни веб-читачи га подржава?у без потребе за инсталира?ем додатака. Комбинован са HTML ?езиком и CSS-om ?аваскрипт чини DHTML (Dynamic HTML).[3] ?аваскрипт ?е ?език заснован на прототиповима са функци?ама првог реда, што га чини ?езиком вишеструке парадигме ко?и подржава об?ектно-ори?ентисани,[4]императивни и функционални начин програмира?а. Садржи АПИ за рад са текстом, низовима, датумима и регуларним изразима, али не и улазно/излазне функционалности, као што су повезива?е, складиште?е података или графичке функционалности, за шта се осла?а на окруже?е у коме се извршава.
Иако се на први поглед може ре?и да ?аваскрипт има одре?ене сличности са програмским ?езиком ?ава, као што су назив, синтакса и стандардне библиотеке, они су два потпуно различита програмска ?езика ко?а се знача?но разлику?у у свом диза?ну. На програмски ?език ?аваскрипт на?више су утицали ?езици као што су Селф и Scheme.[5]
?аваскрипт се поред Веба користи и у другим окруже?има, као што су PDF документи, Веб-читачи за специфичне веб-са?тове (енгл.site-specific browsers) и десктоп ви?ети (енгл.widget). Нове и знатно брже ?аваскрипт виртуелне машине и платформе засноване на ?има, популаризовале су ?аваскрипт за израду веб апликаци?а на серверско? страни. На кли?ентско? страни, програмери на?чеш?е имплементира?у ?аваскрипт као интерпретирани ?език, али све више нови?их веб-читача обав?а just-in-time компа?лира?е. ?аваскрипт се ?ош користи и за разво? видео игара, десктоп и мобилних апликаци?а као и у мрежном програмира?у на серверско? страни са извршним окруже?има као што ?е Node.js.
?С припада ОО парадигми, ?ер програмер не дефинише само тип података, него и врсту операци?а (функци?а) ко?е се могу применити на структуре података. На ова? начин, структура података поста?е об?екат ко?и ук?учу?е и податке и функци?е. Поред тога, програмери могу да праве односе изме?у ?едног и другог об?екта. На пример, об?екти могу да наследе карактеристике од других об?еката.[3] Скриптни ?е ?език, ?ер се састо?и од сери?е команди ко?е се очитава?у у интерпретеру, а да се претходно не компа?лира садржа?. Односно не преводи се у машински ?език, него се команде директно ?чита?у” из кода (изворног кода или ба?товског кода). Због ове карактеристике ?аваСцрипт се извршава на страни корисника (client side), т?. на рачунару на ко?ем ?е покренут садржа? са ?аваскриптом. Сам по себи, HTML дозво?ава посетиоцу да поша?е податке ка серверу на обраду. Нажалост, ако ти подаци нису валидни цео процес се мора поновити све док се не унесу валидни подаци. Ово ?е ?едан од основних разлога настанка ?аваскрипта ко?и проверава веродосто?ност података на кли?ентовом прегледачу и тако олакшава посао на вебу.[3]
?аваскрипт ?е на?популарни?и скриптни ?език на Интернету ко?ег подржава?у сви познати?и прегледачи (Internet Explorer, Mozilla Firefox, Netscape, Opera, Safari). Неке примене ?С су:
?аваскрипт да?е HTML диза?нерима алат за програмира?е - HTML аутори обично нису програмери, али ?аваскрипт ?е скриптни ?език са веома ?едноставном синтаксом.
?аваскрипт може да динамички унесе код у HTML страну,
?аваскрипт може да реагу?е на дога?а?е - ?аваскрипт може да се подеси тако да се изврши кад се нешто деси, нпр. кад се страна учита или кад корисник кликне на HTML елемент,
?аваскрипт може да прочита или испише HTML елементе - ?аваскрипт може да прочита и да промени садржа? HTML елемента,
?аваскрипт може да се користи за проверу исправности унетих података - ?аваскрипт може да се користи за проверу исправности података унетих у форму, да провери исправност података пре него што се поша?у серверу,
?аваскрипт може да се користи за детектова?е браузера корисника - у зависности од браузера, учитава се страна специ?ално диза?нирана за та? браузер,
?аваскрипт може да се користи за креира?е куки?а - ?аваскрипт може да се користи за чува?е и вра?а?е информаци?а о рачунару посетиоца, итд.
Године 1993, Национални центар за суперкомп?утерске апликаци?е (енгл.National Center for Supercomputing Applications - NCSA), ко?и ?е део Универзитета у Илиноису, об?авио ?е Мозаик, први популарни графички веб-читач, ко?и ?е одиграо знача?ну улогу у разво?у Веба ко?и ?е у то време био на самом зачетку. 1994. године у Маунтин В?уу, у Калифорни?и, основана ?е компани?а под називом Мозаик Ком?унике?шн, ко?а ?е запослила ве?ину аутора оригиналног веб-читача Мозаик како би развили Мозаик Нетске?п. Касни?е ?е се испоставити да ова? веб-читач не?е имати никакве сличности са оригиналним Мозаиком. Интерни назив за ова? веб-читач био ?е "Мозила", што ?е значило "убица Мозаика" енгл.Mosaic killer, ?ер ?е ци? компани?е био да замени Мозаик као на?популарни?и веб-читач на свету. Прва верзи?а веб-читача, Мозаик Нетске?п 0.9, об?ав?ена ?е кра?ем 1994. године. За само четири месеца ова? веб-читач ?е ве? заузео три четвртине тржишта веб-читача и постао ?е на?популарни?и веб-читач деведесетих година 20. века. Како би избегли проблеме са ауторским правима са НЦСА, веб-читач ?е исте године добио нов назив, Нетске?п навигатор, a компани?а Нетске?п Ком?унике?шн.
У ово? компани?и су на време схватили да би Веб требало да постане динамични?и. Оснивач компани?е, Марк Андресен, тврдио ?е да HTML-у треба прате?и ?език ко?и веб диза?нери и програмери могу лако да користе за склапа?е компоненти као што су слике и додаци, чи?и би се код писао директно у HTML коду веб странице. Како би уопште започели са радом, компани?а Нетске?п Ком?унике?шн ?е морала да сара?у?е са компани?ом Сан Ма?кросистемс да би у ова? веб-читач уградили ?ихов статични програмски ?език ?аву и тиме се борили са конкурентском компани?ом Ма?крософт за ве?у наклоност корисника и усва?а?е веб технологи?а и платформи.[6] Одлучено ?е да се креира програмски ?език комплементаран ?ави, са сличном синтаксом, што ?е у старту значило одбацива?е подршке за друге програмске ?езике као што су Перл, Па?тон, TCL или Scheme. Како би одбранили иде?у ?аваскрипта у односу на понуду конкурената, компани?е ?е био потребан прототип. А?к ?е написао прототип буду?ег програмског ?езика за 10 дана, у ма?у 1995. године.
Иако ?е разви?ан под кодним називом Мока, ?език ?е званично назван Ла?вскрипт приликом првог об?ав?ива?а бета верзи?а Нетске?п навигатора 2.0, септембра 1995. године, али ?е убрзо преименован у ?аваскрипт[1] са об?ав?ива?ем Нетске?п навигатора 2.0 бета 3 верзи?е, у децембру исте године.[7] Коначан избор имена ?е изазвао конфузи?у код корисника ?ер ?е створен утисак да ?е ово ?ош ?една вари?анта програмског ?езика ?ава, а сам избор имена ?е окарактерисан као маркетиншки трик Нетске?па како би се ?аваскрипт представио као на?нови?и веб програмски ?език.
Често се ?ав?а погрешно тумаче?е да ?е на разво? ?аваскрипта битно утицао веб скриптни ?език Ц-- разви?ен од стране компани?е Номбас (ова? скриптни ?език не треба мешати са касни?е разви?еним ?езиком Ц--, 1997. године]).[8][9] У прилог томе иде и чи?еница да Брендан А?к ни?е никад чуо за Ц-- пре него што ?е креирао Ла?вСкрипт.[10] Номбас ?е обезбе?ивао угра?ене скриптне веб странице Нетске?пу, иако концепт скриптних веб страница ни?е био нов, као што се може видети у веб-читачу ViolaWWW.[11] Касни?е ?е компани?а Номбас одлучила да у свом производу СкриптИз, Ц-- замени ?аваскриптом и учествовала ?е у стандардизаци?и ЕКМАСкрипта кроз ТЦ39 групу.[12]
У децембру 1995. године, убрзо након об?ав?ива?а ?аваскрипта за веб-читаче, компани?а Нетске?п ?е представила и имплементаци?у овог ?езика за сервере кроз Нетске?п ентерпра?з сервер (енгл.Netscape Enterprise Server).
Од средине 2000-их, об?ав?ено ?е неколико серверских ?аваскрипт имплементаци?а, ме?у ко?има на?познати?и Node.js (2009. године).[13]
Ма?крософт ?е 1996. године представио сво?е скриптне ?езике, ВБСкрипт и ?Скрипт. ?Скрипт, обрнута имплементаци?а Нетске?повог ?аваскрипта, била ?е део Интернет Експлорера 3. ?Скрипт ?е тако?е био доступан и као серверска имплементаци?а скриптног ?езика у Интернет Информационом Серверу. Интернет Експлорер 3 ?е по први пут донео подршку за CSS и различите HTML додатке, али се водило рачуна о томе да свака имплементаци?а буде знача?но различита од оне у Нетске?п навигатору.[14][15] Ове разлике су отежавале диза?нерима и програмерима да праве веб-са?тове ко?и би функционисали у оба веб-читача, што ?е довело до по?аве логоа "на?бо?и приказ у Нетске?пу" и "на?бо?и приказ у Интернет Експлореру" ко?и су обележили почетне године борбе ме?у веб-читачима.[16] ?аваскрипт ?е почео да стиче репутаци?у препреке вишеплатформском и стандардизованом Вебу. Програмери су се прихватили задатка да покуша?у да праве веб-са?тове ко?и ?е радити у оба на?познати?а веб-читача иако ве?ина ни?е имала времена за то.[14] Об?авом Интернет Експлорера 4, Ма?крософт ?е представио концепт динамичког HTML-а, али су разлике у имплементаци?и ?езика и различити власнички об?ектни модели докумената представ?али препреке за ширу примену ?аваскрипта на Вебу.[14]
У новембру 1996. године, Нетске?п ?е стандардизовао ?аваскрипт како би остале компани?е ко?е разви?а?у веб-читаче могле да га имплементира?у у сво?им производима. То ?е довело до званичног об?ав?ива?а спецификаци?е ?езика ЕКМАСкрипт ко?а ?е об?ав?ена у прво? верзи?и ЕКМА-262 стандарда у ?уну 1997. године, чи?а ?е на?познати?а имплементаци?а управо ?аваскрипт. ЕкшнСкрипт и ?Скрипт су тако?е познате имплементаци?е ЕКМАСкрипта са додацима.
Процес стандардизаци?е ?е настав?ен у циклусима, об?ав?ива?ем ЕКМАСкрипта 2 у ?уну 1998. године, ко?и доноси одре?ене промене како би се прилагодио ISO/IEC 16262 ме?ународном стандарду. Са об?ав?ива?ем ?е настав?ено у децембру 1999. године са ЕКМАСкриптом 3, ко?и представ?а основу за ?аваскрипт какав данас знамо. Разво? оригиналног ЕКМАСкрипта 4, ко?и ?е водио Валдемар Хорват (тада запослени у Нетске?пу, данас у Гуглу), почео ?е 2000. године и на самом почетку ?е изгледало као да Ма?крософт учеству?е у томе па ?е чак и имплементирао неке карактеристике у ?ихов ?Скрипт .НЕТ ?език.
Временом ?е било ?асно да Ма?крософт не намерава да сара?у?е нити да имплементира ?аваскрипт у ИнтернетЕксплореру, иако нису имали досто?ну алтернативу ве? само парци?ално завршену имплементаци?у .НЕТ серверске стране. Због тога ?е до 2003. године разво? ЕКМАСкрипта 4 био запостав?ен.
Следе?а битна година за ?аваскрипт била ?е 2005, ко?у су обележила два велика истори?ска дога?а?а битна за разво? ?аваскрипта. Прво су се Брендан А?к и Мозила придружили ЕКМА Интернашонал као непрофитни чланови и започет ?е рад на ЕКМАСкрипту за XML (E4X), ЕКМА-357 стандарду, ко?и ?е потекао од Ма?крософтових бивших запослених ко?и су сад радили за БЕА Системс. То ?е довело до за?едничког рада са компани?ом Макромеди?а (ко?у ?е касни?е купио Адоби Системс), ко?и су применили E4X у свом ЕкшнСкрипту 3 (ЕкшнСкрипт 3 ?е био форк оригиналног ЕКМАСкрипта 4).
За?едно са Макромеди?ом поново ?е отпочет разво? ЕКМАСкрипта 4 са ци?ем стандардизаци?е компоненти из ЕкшнСкрипта 3. На кра?у овог процеса, Адоби Системс ?е об?авио ЕкшнСкрипт виртуелну машину верзи?е 2, кодног назива Тамарин, као про?екат отвореног кода. Ме?утим, Тамарин и ЕкшнСкрипт 3 су били знача?но различити од онога чему ?аваскрипт тежи, што су обе стране увиделе током 2007. и 2008. године.
На тржишту ?е владао хаос ме?у различитим играчима. Даглас Крокфорд, тада запослени у ?аху-у, удружио се са Ма?крософтом 2007. године како би се супротставио ЕКМАСкрипт 4 стандарду, што ?е довело до разво?а ЕКМАСкрипт 3.1 стандарда. Иако разво? ЕКМАСкрипт 4 стандарда никад ни?е довршен, он ?е битно утицао на наредне верзи?е.[17]
Док се све ово дешавало, за?еднице отвореног кода и програмера су наставиле на разво?у револуционарних могу?ности са ?аваскриптом. Напор за?еднице ?е добио зама?ац 2005. године када ?е ?еси ?е?мс Гарет осмислио концепт А?акса и описао скуп технологи?а, где ?е ослонац био на ?аваскрипту, ко?е се користе за креира?е веб апликаци?а код ко?их се подаци могу учитавати у позадини, без потребе да се цела страница учита, што ?е довело до разво?а ?ош динамични?их апликаци?а. Све ово ?е довело до периода препорода у кориш?е?у ?аваскрипта, предво?еног библиотекама отвореног кода и за?едницама ко?е су се формирале око ?их, са библиотекама као што су Протота?п, ?е?Квери, До?о Тулкит, МуТулс и друге.
У ?улу 2008. године, раздво?ене стране су се састале у Ослу. То ?е довело до евентуалног договора почетком 2009. године, да се ЕКМАСкрипт 3.1 стандард преимену?е у ЕКМАСкрипт 5 и да се ?език унапреди прате?и агенду познати?у као Хармони (енгл.Harmony). ЕКМАСкрипт 5 ?е коначно об?ав?ен у децембру 2009. године.
У ?уну 2011. године, ЕКМАСкрипт 5.1 ?е об?ав?ен како би се у потпуности из?едначио са тре?им изда?ем ISO/IEC 16262 ме?ународног стандарда. ЕКМАСкрипт 2015 ?е об?ав?ен у ?уну 2015. године. Тренутна верзи?а ЕКМАСкрипт 2016 ?е об?ав?ена у ?уну 2016. године.[18]
?аваскрипт ?е постао ?едан од на?популарни?их програмских ?езика на Вебу. Ме?утим, на самом почетку ?език ни?е био на добром гласу ме?у програмерима професионалцима, због тога што су му, изме?у осталог, ци?на публика били веб аутори и остали "аматери".[19] Са по?авом А?акса ?аваскрипт се вра?а у центар паж?е и поста?е атрактиван за све више програмера. Резултат тога ?е умножава?е обимних фре?мворка и библиотека, побо?шана ?аваскрипт рутина програмира?а и пове?ано кориш?е?е ?аваскрипта изван веб-читача, што ?е у директно? корелаци?и са знача?ним разво?ем серверских ?аваскрипт платформи.
У ?ануару 2009. године, представ?ен ?е про?екат Комон?С (енгл.CommonJS) са ци?ем стандардизаци?е за?едничких библиотека, углавном за ?аваскрипт разво? изван веб-читача.[20]
Са порастом ?едностраничних апликаци?а и напредних ?аваскрипт са?това, пове?ано ?е ?егово кориш?е?е од стране компа?лера како за динамичке тако и за статичке програмске ?езике.
?аваскрипт подржава ве?и део структуриране синтаксе програмског ?езика C (нпр. if исказе, while пет?е, switch исказе, do while пет?е, и др.). Делимичан изузетак ?е опсег промен?ивих: ?аваскрипт ?е у оригиналу подржавао само функционални опсег промен?ивих помо?у деклараци?е var. ЕКМАСкрипт 2015 доноси к?учну реч let за блоковски опсег, тако да сада ?аваскрипт подржава функционални и блоковски опсег. Као и C, ?аваскрипт прави разлику изме?у исказа и израза. ?ош ?една битна разлика у односу на C ?е и аутоматско умета?е кра?а наредбе односно карактера тачка-зарез, па ни?е потребно експлицитно наглашавати кра? наредбе са знаком тачка-зарез.[23]
Као и ве?ина скриптних ?езика, ?аваскрипт ?е ?език са динамичном провером куца?а; тип ?е повезан са сваком вреднош?у пре него са сваком изразом. На пример, уколико имамо неку промен?иву ко?а ?е везана за бро?, та иста промен?ива касни?е може бити везана за стринг.[24] ?аваскрипт подржава различите начине провере типа об?екта.
Провера приликом извршава?а
?аваскрипт садржи eval ко?а може да извршава исказе у облику стрингова у време извршава?а.
?аваскрипт ?е скоро у потпуности об?ектно заснован скриптни ?език. У ?аваскрипту, об?екат представ?а асоци?ативни низ, наглашен помо?у прототипа; сваки к?уч у облику низа карактера представ?а назив сво?ства об?екта за ко?и посто?и два синтаксна начин за дефиниса?е таквог назива; нотаци?а са тачком, енгл.dot notation (obj.x = 10) и нотаци?а са заградама, енгл.bracket notation (obj['x'] = 10). Сво?ство се може додати или обрисати за време извршава?а кода. Ве?ина сво?става об?екта (или било ког сво?ства ко?е припада ланцу насле?ива?а прототипа об?екта) се може набро?ати кориш?е?ем for...in пет?е.
?аваскрипт садржи ограничен бро? угра?ених об?еката, као што су Date и Function.
Прототипови
?аваскрипт користи прототипове у случа?евима у ко?има други об?ектно-ори?ентисани програмски ?езици користе класе за насле?ива?е.[25] Помо?у прототипова у ?аваскрипту ?е могу?е симулирате многе карактеристике класа.[26]
Функци?е као конструктори об?еката
Функци?е осим сво?е главне функци?е, има?у и улогу конструктора об?еката. Додава?ем префикса new испред позива функци?е, креира нову инстанцу прототипа, насле?у?у?и сво?ства и методе конструктора (ук?учу?у?и и сво?ства Object прототипа).[27] ЕКМАСкрипт 5 садржи методу Object.create, ко?а омогу?ава експлицитно креира?е инстанце без аутоматског насле?ива?а Object прототипа (стари?а окруже?а могу доде?ивати прототипу вредност null).[28] Сво?ство prototype конструктора одре?у?е ко?и об?екат се користи као интерни прототип новог об?екта. Нове методе се могу додати изменом прототипа функци?е ко?а се користи као конструктор. Конструктори доступни у самом ?аваскрипту, као што су Array и Object, тако?е има?у сво?е прототипове ко?и могу да се измене. Иако могу?а, измена Object прототипа ни?е добра пракса због тога што ве?ина об?еката у ?аваскрипту насле?у?е методе и сво?ства из Object прототипа и потенци?ално не очеку?у ?егову измену.[29]
Функци?е као методе
За разлику од ве?ине об?ектно-ори?ентисаних ?езика, у ?аваскрипту не посто?и разлика изме?у дефиниса?а функци?а и дефиниса?а метода. На?чеш?е, разлика посто?и код позива?а функци?е; када се функци?а позива као метода об?екта, ?ена локална к?учна реч this се везу?е за та? об?екат приликом позива?а.
Функци?а ?е прве класе и може се третирати као об?екат. Као таква, функци?а може да садржи сво?ства и методе, као што ?е .call() и .bind().[30]Уг?еждена функци?а ?е функци?а ко?а се дефинише унутар друге функци?е. Оваква функци?а се креира сваки пут када се позове надре?ена функци?а. Додатно, свака надре?ена функци?а формира лексички блок; Лексички блок надре?ене функци?е (ук?учу?у?и константе, локалне промен?иве и вредности аргумената) поста?у саставни део сваког об?екта подре?ене функци?е, чак и након завршетка извршава?а надре?ене функци?е.[31] ?аваскрипт подржава и анонимне функци?е.
?аваскрипт подржава имплицитно и експлицитно делегира?е.
Функци?е као улоге (Traits и Mixins)
?аваскрипт подразумевано подржава различите функци?е имплементиране у виду улога (енгл.Roles)[32] и патерна као што су Traits[33][34] и Mixins.[35] Оваква функци?а дефинише додатно понаша?е барем ?едне методе везане за к?учну реч this унутар тела функци?е. Улога се након тога експлицитно доде?у?е помо?у call или apply наредбе об?ектима ко?и треба да садрже додатно понаша?е ко?е се не дели кроз ланац прототипова.
Композици?а об?еката и насле?ива?е
Иако експлицитна делегаци?а заснована на функци?ама покрива композици?у об?еката у ?аваСкрипт-у, имплицитна делегаци?а се ве? обав?а сваки пут када се ланац прототипова проширу?е како би, нпр. пронашли методу ко?а ?е потенци?ално повезана али не и у директно? вези са об?ектом. Када се метода ?едном прона?е, она се позива у контексту об?екта. На ова? начин ?е насле?ива?е у ?аваСкрупт-у покривено аутоматизмом делегаци?е ко?и се везу?е за сво?ства прототипа у оквиру функци?а у конструктору.
?аваСкрипт се на?чеш?е осла?а на извршно окруже?е (нпр. Веб претраживач) как оби обезбедило об?екте и методе помо?у ко?их скрипте врше интеракци?у са окруже?ем (нпр. Об?ектни модел документа веб странице). Тако?е се на извршно окруже?е осла?а и да би обезбедили могу?ност ук?учива?а скрипти (нпр. помо?у HTMLscript елемента). Ово ни?е особина самог програмског ?езика, иако ?е за?едничка карактеристика многих ?аваСкрипт имплементаци?а.
?аваСкрипт обра?у?е поруке из реда ?едну по ?едну. Пре него што учита нову поруку, ?аваСкрипт позива функци?у везану за ову поруку, чиме се креира оквир позивног стека (аргументи функци?е и локалне промен?иве). Позивни стек се шири и расте у зависности од потреба функци?е. Пре самог извршава?а функци?е, када ?е стек празан, ?аваСкрипт настав?а са обрадом следе?е поруке у реду. То се ?ош назива и пет?ом дога?а?а (енгл.event loop) и опису?е као "скок на завршетак" ?ер ?е свака порука у потпуности обра?ена пре него што се у обзир узме следе?а порука. Без обзира на то, модел конкурентности програмског ?езика дефинише да пет?а дога?а?а не блокира само извршава?е: улазно/излазне операци?е програма се одви?а?у путем дога?а?а и повратних функци?а. То значи, на пример, да ?аваСкрипт може да обради клик мишем док чека да упит над базом података врати тражену информаци?у.[36]
Вари?ативне функци?е
Функци?и може бити просле?ен неограничен бро? аргумената. Функци?а им приступа путем формалних параметара или кроз локални arguments об?екат. Вари?ативне функци?е се тако?е могу креирати и помо?у bind методе.
Низ и литерали об?еката
Као и код многих програмских ?езика, низови и об?екти (асоци?ативни низови у другим ?езицима) се могу креирати помо?у скра?ене синтаксе. Заправо, ови литерали формира?у базу JSON формата података.
Регуларни изрази
?аваСкрипт тако?е подржава регуларне изразе на начин сличан ономе у програмском ?езику Перл, ко?и пружа прецизну и снажну синтаксу за манипулаци?у текстом ко?а ?е доста напредни?а од угра?ених функци?а знаковних низова.[37]
Разво?ем ?аваСкрипт програмског ?езика управ?а Мозила Фондаци?а, док се нове функционалности периодично дода?у ?езику. Ме?утим, само одре?ени покретачи ?аваСкрипт-а подржава?у ове нове функционалности:
По?ам Ванила ?аваскрипт или Ванила ?С се односи на ?аваскрипт ко?и ни?е проширен неким фре?мворком или додатним библиотекама. Скрипт написан Ванила ?аваскриптом ?е чист ?аваскрипт код.
Бро?еви: све вредности су представ?ене као реални бро?еви (64 бита, IEEE 754 стандард). У случа?у прекораче?а (overflow) генерише се +/- Infinity.[41] У случа?у поткораче?а (underflow) генерише се 0/ "negative zero". Де?е?е нулом не резултира грешком осим у случа?у 0/0 – тада се генерише NaN. Infinity и NaN су глобалне промен?иве ко?е се могу само читати.
Стрингови су непромен?иве секвенце 16-битних вредности, углавном Уникодних карактера и мора?у бити под двоструким или ?едноструким наводницима ("string", '123str45', "vise reci", ...). Тако?е, битно ?е запамтити да индекси кре?у од нуле, а не од ?единице.[41] Стринг може садржати и HTML кодове, као и следе?е специ?алне текст ознаке:
null - представ?а недоста?у?у вредност (?езичка к?учна реч);[41] undefined - представ?а недоста?у?у вредност (глобална промен?ива ко?а се може само читати); доби?а се као резултат приступа сво?ствима или елементима низа ко?и не посто?е или као резултат функци?а ко?е нема?у return.[41] Ово ?е можда мало збу?у?у?е, али битно ?е запамтити да ?е undefined сам по себи (недефинисан) тип, а null ?е об?екат.
Об?екти су све преостало, односно, неуре?ена колекци?а именованих вредности (сво?става). Они су динамичке природе и за разлику од примитивних типова преносе се по референци, а не по вредности. Сваки пут када се интерпретер покрене или се учита нова страна у прегледачу, креира се нешто што се зове глобални об?екат и на нивоу ?ега се дефинишу и иници?ализу?у сво?ства типа undefined, NaN, глобалне функци?е типа isNaN(), parseInt(), конструктори као што су Date(), Array(), String(),..., глобални об?екти ко што су Math, JSON,... Резервисана реч ко?ом се у глобалном опсегу може реферисати на ова? об?екат ?е this. На нивоу прегледача то ?е Виндоус об?екат ко?и се може реферисати са window.[41]
У програмира?у се често долази у ситуаци?у у ко?о? се део програма понав?а на више различитих места. Посто?и потреба да се та? део програма издво?и и да се позива по потреби. То се оствару?е помо?у функци?а. Функци?е представ?а?у потпрограме ко?и углавном вра?а?у резултат неког израчунава?а. Вра?а?е резултата ни?е обавезно.[42] Да би се користила функци?а, она се мора декларисати. Деклараци?а обавезно садржи к?учну реч function. После ?е се може навести назив функци?е, а онда обавезно заграде унутар ко?их се може навести листа формалних аргумената. Коначно, обавезно се наводе витичасте заграде унутар ко?их се може навести тело функци?е, односно ?ене наредбе.[42]
Наредбе унутар функци?е се не извршава?у док се функци?а не позове. Позив функци?е се обав?а ?едноставно наво?е?ем назива функци?е и, обавезно, заграда унутар ко?их се може навести листа аргумената.[42]
Приликом деклараци?е функци?е може се навести листа параметара. Листа параметара ?е обично списак промен?ивих.
functionzbir(a,b){varrezultat=a+b;}
У наведеном примеру a и b су локалне промен?иве у функци?и. Функци?а узима просле?ене параметре, у овом случа?у два бро?а и вра?а ?ихов збир. Функци?а као параметар може узимати неке вредности или референце на об?екте. У програму могу несметано посто?ати истоимене промен?иве докле год су у различитом локалном опсегу.[42]
Формални параметри су они ко?и се наводе у деклараци?и функци?е и ко?и се користе када се пише тело функци?е. Стварни аргумент су конкретне вредности ко?е се наводе. При позиву функци?е битно ?е да параметри има?у вредности.
zbir(5,2);zbir(x,y*4);
У класичном програмира?у важи да се стварни и формални параметри мора?у поклопити по бро?у, типу и редоследу. ?аваскрипт дозво?ава одступа?е од овог правила. То значи да ?е дозво?ено да се наведе више стварних аргумената него што ?е предви?ено (вредности вишкова се игноришу), или да их има ма?е (у функци?и ?е недоста?у?и параметри имати вредност undefined). Пошто ?аваскрипт ни?е строго типизиран ?език, не посто?и начин да се програмер натера да користи тачно одре?ене типове при позиву функци?е. То што ?е оваква пракса дозво?ена не значи да ?е поже?на.[42]
Унутар функци?е се на ?едном или више места може навести наредба return, после ко?е се наводи вредност ко?а се вра?а као резултат функци?е. Важно ?е нагласити да чим се у извршава?у функци?е наи?е на наредбу return, функци?а прекида све и остале наредбе ?е бити игнорисане.[42]
Вредност функци?е се може користити унутар израза.
varp=zbir(a-10,zbir(c*2,b)/2);
Пример функци?е ко?а рачуна квадрат бро?а
functionkvadratBroja(x){returnx*x;}---x=kvadratBroja(5);/* poziv funkcije */document.write("Kvadrat od 5 je "+x);//u HTML dokumentu ispisuje vrednost---Kvadratod5je25
?аваскрипт Array об?екат ?е глобални об?екат ко?и се користи као конструктор за креира?е низова.[43]
//kreiranje nizavarniz=[1,2,3,"Soldier of fortune"];//ilivarnovi_niz=newArray(4,5,"I can't make you love me");varn=niz.length;// u promenljivu n upisujemo du?inu nizavarprvi=niz[0];// prvi sadr?i 1, tj. prvi element nizavarposlednji=niz[niz.length-1];//poslednji sadr?i "Soldier of fortune", tj. poslednji element niza//for je kolekcijskiniz.forEach(function(itemindexarray)){console.log(item,index);});/*1 0 2 1 3 2 "Soldier of fortune" 3*///dodavanje elementa na kraj nizavarkraj=niz.push("Tears in heaven");// niz: [1, 2, 3, "Soldier of fortune", "Tears in heaven"]//brisanje elementa sa kraja nizavarposlednji=niz1.pop();//niz: [1, 2, 3, "Soldier of fortune"]//brisanje elementa sa pocetka nizavarprvi=niz1.shift();//niz: [2, 3, "Soldier of fortune"]//dodavanje na po?etak nizavarnovi_niz=niz1.unshift("Wish you were here");//niz: ["Wish you were here", 2, 3, "Soldier of fortune"]//pronala?enje pozicije na kojoj se element nalazivarpozicija=niz1.indexOf(2);//1//brisanje elementa koji se nalazi na zadatoj pozicijivarniz1_bez_dvojke=niz1.splice(pos,1);//niz: ["Wish you were here", 3, "Soldier of fortune"]//pravljenje kopije nizavarkopija=niz1.slice();//kreiranje vi?edimenzionih nizovavarvisedimenzioni_niz=[["Ali","sreca","je","uvek","bila","tamo"],["gde","je","neko","umeo","da","voli"],["i","ziveo","za","svoja","osecanja"]];//pristupanje elementimavarelement=visedimenzioni_niz[1][5];//"voli"varprvi_element=visedimenzioni_niz[0];//["Ali", "sreca", "je", "uvek", "bila", "tamo"]//primervarvrednost=[];for(x=0;x<10;x++){vrednost.push([2**x,2*x**2])};console.table(vrednost.join('\n'));/*"0,0 1,2 4,8 9,18 16,32 25,50 36,72 49,98 64,128 81,162"*/
Сваки од прегледача има сво? подразумевани начин реагова?а на грешке, нпр. Фа?ерфокс и Кроум упису?у грешке у лог датотеку, док рецимо Интернет Експлорер и Опера генеришу обавеште?а за корисника. Због удобности рада корисника потребни су механизми ко?и би омогу?или рукова?е с грешкама.[46]
Грешке се могу обра?ивати у оквиру try-catch блока: овакве грешке прегледачи сматра?у приме?еним па не реагу?у на ?их.
try{...}catch(error){...}
Типови грешака ко?и могу да се ?аве:
Error - основни тип грешке (сви остали се насле?у?у) има сво?ство message са описом грешке и сво?ство name ко?им се одре?у?е тип грешке. Прегледачи интерно обога?у?у ова? об?екат, па нпр. Фа?ерфокс има и сво?ства fileName са именом датотеке у ко?о? се ?авила грешка, lineNumber ко?и садржи лини?у грешке и stack ко?и садржи stack trace.[46]
EvalError - грешка ко?а се генерише при раду са eval() функци?ом ко?а извршава ?аваскрипт код записан у виду ниске и просле?ен као аргумент, нпр. eval("var a,b,c;a=5;b=10;c=a+b"). Ову функци?у треба користити уз опрез уколико посто?и могу?ност да ?ен аргумент постане малициозни код ко?и може да угрози податке и апликаци?у. Уз све то, eval() се нешто спори?е извршава ?ер експлицитно позива ?С интерпретер.[46]
RangeError - грешка ко?а се генерише када вредност ко?а се наводи ни?е у скупу или опсегу дозво?ених вредности, нпр. a=new Array(-20)[46]
ReferenceError - ?ав?а се у случа?евима када се реферише на непосто?е?у промен?иву[46],
нпр. a=x;, док x не посто?и
SyntaxError - обично се ?ав?а када се проследи синтаксно неисправан код функци?и eval(); у свим осталим случа?евима синтаксне грешке аутоматски прекида?у извршава?е ?аваскрипт кода[46]
TypeError - тип грешке ко?и се на?чеш?е ?ав?а и то када ?е промен?ива неодговара?у?ег типа или када се покушава са приступом методи ко?а не посто?и[46]
URIError - грешка ко?а се ?ав?а као последица кориш?е?а функци?а encodeURI() и decodeURI() на УРИ аргументима ко?и су погрешног формата. Функци?а encodeURI() само врши УРИ кодира?е, кодира?у се сви специ?ални карактери(%HH) осим резервних карактера: ;,/?:@&=+$# слова и карактера: _ . ! ~ * ' ( )[46]
Уписива?е у централизовани лог систем (на страни сервера): сваки пут када се грешка ?ави може се генерисати AJAX позив ко?и садржи тип грешке и позив грешке; тако се лакше може пратити понаша?е апликаци?е на страни кли?ената.[46]
//image pings tj. slanje zahteva preko img objektafunctionlogerror(type,message){varimg=newImage();imgsrc="log.php?type="+encodeURIComponent(type)+"&message="+encodeURIComponent(message);}ukodu...catch(error){if(errorinstanceofSyntaxError){logerror("syntax","Description:"+error.message);}...}
Image pings ?е ?едносмерни вид комуникаци?е изме?у кли?ента и сервера ко?и заобилази правило истог порекла (може се комуницирати изме?у разнородних домена).
често се користе за пра?е?е корисничких кликова
мана им ?е што не посто?и могу?ност сла?а само GET захтева, и што не посто?и могу?ност обраде серверског текстуалног одговора.[46]
У овом делу се разматра?у на?основни?е ствари без ко?их ?е немогу?е било шта креирати везано за ?аваскрипт. Ту се пре свега мисли на ?аваскрипт синтаксу, типове промен?ивих, операторе итд.
Посто?е две могу?ности: писа?ем директно у HTML код или смешта?ем у посебан фа?л (екстензи?а .js) ко?и се потом позива у HTML документу. Оба начина су правилна и не посто?и разлика у раду скрипта. Позива?е спо?аш?ег фа?ла ?е добро у случа?евима када се ?една иста скрипта користи у више страница.[47] Браузер чита HTML страницу и приказу?е елементе онако како они наилазе. Када наи?е на скрипт у страници, обав?а се ?егово извршава?е пре него што се настави чита?е осталих елемената (текст, слике...).[47]
Примери
?аваскрипт писан у HTML документу:
<html><body><scripttype="text/javascript">document.write("Ovo je moj prvi JavaScript!");</script></body></html>
Посто?е различити начини позива?а ?аваскрипт кода, т?. различита места где се он може сместити у страници. Први начин ?е да се ?аваскрипт код стави у <head> секци?и, док ?е други начин смешта?е унутар <body> секци?е документа. Код првог начина скрипта се учитава одмах, ?ош пре учитава?а читаве странице, док се код другог начина скрипта извршава чим браузер наи?е на ?у. Могу?е ?е поставити неограничен бро? скрипти у страници, било да се ради о првом или другом случа?у.[47]
Коментари се користе ради лакшег сналаже?а у коду, и као подсетници. То ?е начин за остав?а?е напомена током програмира?а, чиме се олакшава рад на коду.[47]
Разлику?емо два типа коментара:
?еднолини?ски
//ovo je komentar
вишелини?ски
/*ovo je duga?ak vi?elinijski JavaScript komentar*/
?аваскрипт као и остали програмски ?езици, користи промен?иве да би запамтио вредности, тако да се оне касни?е могу користити у другим деловима програма. Имена промен?ивих могу да почи?у великим словима (A - Z), малим словима (a - z), или до?ом цртом (_). Преостали карактери могу да се састо?е од малих и великих слова, до?е црте, или цифара од 0 до 9. Тако?е, битно ?е напоменути да ?аваскрипт разлику?е мала и велика слова. ?аваскрипт за разлику од неких других програмских ?езика не захтева специфицира?е типа вредности промен?иве, он то чак и не дозво?ава. Иста промен?ива може да се користи за смешта?е различитих типова вредности у ?о?, као што су стрингови, цели бро?еви, реални бро?еви (3.14) или логичке вредности. ?аваскрипт интерпретатор аутоматски конверту?е тип података ко?и се налази у промен?иво?. Стрингови се мора?у наводити под наводницима, док остали типови то не захтева?у.[48]
За деклариса?е промен?ивих користи се к?учна реч var:[47]
локалне - вид?еве су само у блоку у ком су декларисане
глобалне - вид?иве су у целом програму
Ако се промен?ива декларише у оквиру неке функци?е без к?учне речи вар, сматра се да ?е та промен?ива глобална, т?. вид?ива ?е у целом коду.[47]
functionprimer1(){a=1;}varb=a+2;
Дакле, a ?е глобална и могу?е ?о? ?е приступити.
vara=1;functionprimer2(){varb=a+2;}
И у овом примеру ?е могу?е приступити промен?иво? a ?ер ?е глобална.
Ме?утим, у следе?ем примеру то не?е бити могу?е, ?ер се а сматра локалном промен?ивом.
Оператори у ?аваскрипту представ?а?у симболе, ко?и означава?у одре?ену операци?у или релаци?у и ко?е повезу?у ?едан или више операнада у ?едан израз (аритметички, логички...). За целобро?не типове те операци?е ук?учу?у аритметичке, релаци?ске и логичке операци?е. Подржани су и операци?е ко?е се приме?у?у над по?единачним битовима целобро?них вредности. Оператори се деле на основу сво?е парности т?. бро?а операнада на ко?е се приме?у?у. Унарни оператори делу?у само на ?едан операнд и могу бити префиксни када се наводе испред операнда и постфиксни када се наводе након операнда. Бинарни операнди има?у два операнда и обично су инфиксни т?. наводе се изме?у сво?их операнада. Посто?и и тернарни оператор ко?и се приме?у?е на три операнда.
Изрази могу да обухвата?у више оператора и заграде и користе се да би одредиле ко?им редоследом их треба приме?ивати. Посто?е конвенци?е ко?е омогу?ава?у изостав?а?е заграда. ?една од основних таквих конвенци?а ?е приоритет оператора ко?и дефинише ко?им редоследом ?е се два различита оператора приме?ивати када се на?у у истом, незагра?еном изразу. Наки од основних принципа у дефиниса?у приоритета:
Унарни оператори има?у ве?и приоритет у односу на бинарне.
Постфиксни унарни оператори има?у ве?и приоритет у односу на префиксне унарне операторе.
Аритметички оператори има?у приоритет у односу на релаци?ске ко?и има?у приоритет у односу на логичке операторе.
Оператори доделе има?у веома низак приоритет.
Друга важна конвенци?а ?е асоци?ативност оператора ко?а дефинише ко?им редоследом ?е се израчунавати два иста оператора или оператора истог приоритета када се на?у узастопно у истом, незагра?еном изразу. Обично се разлику?у лева асоци?ативност, када се израз израчунава слева надесно, и десна асоци?ативност, када се израз израчунава здесна налево. Ве?ина оператора има леву асоци?ативност (на?знача?ни?и изузеци су префиксни унарни оператори и оператори доделе).
Аритметички оператори се користе за извршава?е аритметичких операци?а. Аритметички оператори има?у ве?и приоритет од релаци?ских (оператори поре?е?а), ко?и има?у ве?и приоритет од логичких оператора.[49]
Оператор
Опис
+
унарни плус и сабира?е
-
унарни минус и одузима?е
*
множе?е
/
де?е?е
%
модуо
++
инкрементира?е
--
декрементира?е
**
степен
Унарни + ?е еквивалентан позиву Number() конструктора, т?. претвара сво? операнд у бро?ни тип. Унарни - ради исто то и након тога негира вредност. Унарни - се углавном користи када желимо да користимо негативне бро?еве.
Бинарни + се може користити и за конкатенаци?у стрингова.
Оператор инкрементира?а пове?ава вредност операнда за 1, а декрементира?а сма?у?е за 1. Ови оператори могу бити префиксни и постфиксни. Префиксни оператор инкрементира?а уве?а вредност операнда и врати ?е, а постфиксни оператор инкрементира?а прво врати вредност операнда, па ?е тек онда уве?а. Слично ?е и са декрементира?ем.
vara=3document.write(++a)//postavlja a na 4 i upisuje 4varb=3document.write(b++)//upisuje 3 i postavlja b na 4document.write(b)//upisuje 4document.write(--a)//postavlja a na 3 i upisuje 3document.write(b--)//upisuje 4 i postavlja b na 3document.write(b)//upisuje 3
Вредности промен?ивама доде?у?у се кориш?е?ем оператора доделе. На?чеш?и оператор доде?ива?а ?е знак ?еднако “=”. Оператор доделе може се писати за?едно са бинарним аритметичким операторима.[50]
Симбол
Значе?е
=
// доде?у?е вредност промен?иве или израза с десне стране промен?иво? с леве стране (x=y;)
+=
// сабира две промен?иве (x = x + y;) и доде?у?е збир промен?иво? с леве стране
-=
// одузима две промен?иве (x = x - y;) и доде?у?е разлику промен?иво? с леве стране
*=
// множи две промен?иве (x = x * y;) и доде?у?е производ промен?иво? с леве стране
/=
// дели две промен?иве (x = x / y;) и доде?у?е количник промен?иво? с леве стране
%=
// целобро?но дели две промен?иве (x = x % y;) и доде?у?е остатак при де?е?у промен?иво? с леве стране
Оператори поре?е?а упоре?у?у вредности две промен?иве или израза. Сваки израз у коме се користе оператори поре?е?а има логичку вредност: ако ?е израз тачан, има логичку вредност True, а ако ?е нетачан логичку вредност False.[51]
Симбол
Значе?е
==
// вра?а вредност true ако су промен?иве ?еднаке (x == y)
===
// вра?а вредност true ако промен?иве исте вредности и истог типа
!=
// вра?а вредност true ако промен?иве нису ?еднаке (x != y)
>
// вра?а вредност true ако ?е промен?ива с леве стране ве?а од промен?иве с десне стране (x > y)
<
//вра?а вредност true ако ?е промен?ива с леве стране ма?а од промен?иве с десне стране (x < y)
>=
//вра?а вредност true ако ?е промен?ива с леве стране ве?а или ?еднака од промен?иве с десне стране (x >= y)
<=
//вра?а вредност true ако ?е промен?ива с леве стране ма?а или ?еднака од промен?иве с десне стране (x <= y)
Логички оператори приме?у?у се над истинитосним вредностима, ко?е се представ?а?у кориш?е?ем бро?евних вредности. Уколико ?е бро? ?еднак 0, онда ?е ?егова логичка вредност ?еднака 0 (нетачно), а иначе ?е ?егова логичка вредност ?еднака 1 (тачно). Резултат израчунава?а тачно ни?е произво?на вредност различита од нула, ве? иск?учиво ?едан. Посто?е следе?и логички оператори:[52]
&& - логички AND вра?а вредност true ако су оба израза true
|| - логички оператор OR вра?а вредност true ако ?е барем ?едан израз труе
! - логички оператор NOT вра?а вредност true ако ?е израз false односно false ако ?е израз труе
Условни оператор испиту?е да ли ?е услов испу?ен (вредност true), ако ?есте доде?у?е вредност након упитника, у супротном доде?у?е вредност након двотачке.[53]
poruka=(email=="Da")?"Primio si po?tu.":"Nema po?te.";
Уколико ?е вредност промен?иве email ?еднака “Да” доде?у?емо промен?иво? порука вредност “Примио си пошту.”, у супротном доде?у?емо ?о? вредност “Нема поште.”.
Битовски оператори се користе за рад са по?единачним битовима (1 и 0), ко?и се могу приме?ивати само на целобро?не аргументе.[54]
~ - битовска негаци?а - инверту?е сваки бит аргумента
& - битовска кон?ункци?а - врши кон?ункци?у по?единачних битова два аргумента
| - битовска дис?ункци?а - врши дис?ункци?у по?единачних битова два аргумента
^ - битовска ексклузивна дис?ункци?а - врши ексклузивну дис?ункци?у по?единачних битова два аргумента
<< - лево помера?е (шифтова?е) - врши помера?е битова првог аргумента улево за бро? позици?а ко?и ?е наведен као други аргумент
>> - десно помера?е (шифтова?е) - врши помера?е битова првог аргумента удесно за бро? позици?а ко?и ?е наведен као други аргумент
Унарни оператор ~ има на?ве?и приоритет и десно асоци?ативан ?е. Приоритет оператора помера?а ?е на?ве?и од свих бинарних битовских оператора. Након тога следи & ко?и има ве?и приоритет од ^ ко?и има ве?и приоритет од |. Ови оператори има?у леву асоци?ативност.[54]
x=5&1// 5&1=(0101)&(0001)=(0001) pa je razultat 1x=5|1// 5|1=(0101)|(0001)=(0101) pa je razultat 5x=~5// 5=0101 bitovski ~5=1010 sto je 10x=5^1// (0101)^(0001)=(0100) pa je rezultat 4x=5<<1// 5=0101 a kada 5 siftujemo za jedan ulevo dobijamo 1010 sto je 10x=5>>1// 5=0101 a kada 5 siftujemo za jedan udesno dobijamo 0010 sto je 2
Промен?иве се у ?аваскрипту дефинишу са к?учном речи var.[55]
varx;// дефиници?а промен?иве x. Почетна вредност ове промен?иве ?е недефинисана (eng. undefined).vary=2;// дефиници?а промен?иве у и додела вредности 2.
Коментари се у ?аваскрипт-у пишу на следе?и на следе?и начин.
// кратак коментар у ?едно? лини?и./* Дугачак, документаци?ски коментар. Написан у више лини?а.*//*Коментар /* не сме бити уг?ежден. */Ово?есинтакснагрешка*/
За испис текста на екрану, користи се об?екат console. У примеру ?е дато исписива?е текста Здраво Свете.
console.log("Zdravo Svete.");
Искази if, else и else if
// if исказ се користи ради активира?а одре?ених наредби ако ?е одре?ени услов задово?ен.functionfunkcija4(){varboja=prompt("Koju boju najvi?e voli??")if(boja=="rozu"){alert("Verovatno si ?ensko");}}// else исказ се извршава онда када if услов ни?е задово?ен.functionfunkcija2(){varbroj=prompt("Unesite bilo koji broj!")if(broj<=10){alert("Uneli ste broj manji od 10");}elsealert("Uneli ste broj ve?i od 10")}// else if исказ ?е веома користан ?ер дозво?ава да се наведе више од ?едног услова.varvisitor="";if(visitor=="Drago"{document.write("Pozdrav Drado...");}elseif(visitor=="Miloje"){document.write("Pozdrav Miloje...");}elseif(visitor=="Laki"){document.write("Pozdrav Laki...");}else{document.write("Pozdrav posetio?e...");}
Ова? узорак кода приказу?е разне ?аваскрипт функци?е.
functionLCMCalculator(x,y){varcheckInt=function(x){if(x%1!==0){thrownewTypeError(x+" is not an integer");}returnx;};this.a=checkInt(x)this.b=checkInt(y);}LCMCalculator.prototype={constructor:LCMCalculator,gcd:function(){vara=Math.abs(this.a),b=Math.abs(this.b),t;if(a<b){t=b;b=a;a=t;}while(b!==0){t=b;b=a%b;a=t;}this['gcd']=function(){returna;};returna;},lcm:function(){varlcm=this.a/this.gcd()*this.b;this.lcm=function(){returnlcm;};returnlcm;},toString:function(){return"LCMCalculator: a = "+this.a+", b = "+this.b;}};functionoutput(x){document.body.appendChild(document.createTextNode(x));document.body.appendChild(document.createElement('br'));}[[25,55],[21,56],[22,58],[28,56]].map(function(pair){returnnewLCMCalculator(pair[0],pair[1]);}).sort(function(a,b){returna.lcm()-b.lcm();}).forEach(function(obj){output(obj+", gcd = "+obj.gcd()+", lcm = "+obj.lcm());});
Контроле тока омогу?ава?у ток програма же?еном пута?ом у складу са одре?еним условима.
Основне контроле тока у ?аваскрипту су веома сличне основним контролама тока у вишим програмским ?езицима. Осим ?их, посто?е и контроле тока специфичне само за ?аваскрипт ?език.
Омогу?ава извршава?е одре?еног блока инструкци?а, ако ?е задати услов испу?ен.[56]
Sintaksa:if(logi?kiizraz)blok1;[elseblok2;]
if...else наредба ?е прошире?е if наредбе. If наредба омогу?у?е извршава?е неког кода уколико ?е услов задово?ен, а уколико ни?е не?е се извршити ништа.[56]
Ако се жели написати да уколико услов у if изразу ни?е задово?ен, да се изврши неки други код онда користи се if...else наредба. Вишеструке if…else наредбе се могу угнездити, да би се направила else if наредба.[56]
Switch наредба упоре?у?е израз у загради са вредностима у случа?евима, ако ?е израз ?еднак неко? од вредности у случа?у тада се извршава?у наредбе у оквиру ?ега.[57]
Sintaksa:logi?kiIzraz?izraz1:izraz2;
где ?е израз logi?ki_izraz било ко?и израз чи?и резултат ?е вредност логичког типа. Ако ?е резултат израза true, онда се извршава izraz1, у супротном izraz2.
Sintaksa:switch(izraz){casevrednost1://Naredbe koje se izvr?avaju ako se izraz poklopi sa vrednoscu1[break;]casevrednost2://Naredbe koje se izvr?avaju ako se izraz poklopi sa vrednoscu2[break;]casevrednost3://Naredbe koje se izvr?avaju ako se izraz poklopi sa vrednoscu3[break;]...casevrednostN://Naredbe koje se izvr?avaju ako se izraz poklopi sa vrednoscuN[break;]}
Do...while наредбом се креира пет?а ко?а извршава наредбе док ?е условна наредба тачна. Услов се тестира након изврше?а наредбе, што значи да се наредба мора извршити бар ?едном.[58]
For циклус се запису?е тако да се иза к?учне речи for, запишу у заградама три опциона израза ме?усобно одво?ена тачка-зарезом, а иза ?их наредба ко?а чини тело пет?е.[60]
Izraz1 се типично користи за иници?ализаци?у бро?ача, izraz2 за услов, а izraz3 за инкрементаци?у.
Наравно ови изрази су опциони, тако да се могу и изоставити у зависности од проблема.
Користи се за обилазак итерабилног об?екта (ук?учу?у?и низ, мапу, стринг…), позива?у?и посебну итераци?у и извршава?у?и наредбе за сваки члан об?екта.[62]
Ова наредба заустав?а извршава?е пет?е на тренутно? итераци?и и настав?а ?ено извршава?е на следе?ем итерираном елементу[64]
Sintaksa:continue[labela];
Лабела опциона и везана са лабелом наредби у пет?и. Continue наредба не заустав?а извршава?е као break ве? у случа?у while пет?е проверава поново услов, а у случа?у for пет?е иде на наредбу итераци?е.
Класе су посебне “функци?е” ко?е се дефинишу у телу програма. ?едан од начина дефиниса?а класе ?е кориш?е?ем деклараци?е класе. Да би се декларисала класа користи се к?учну реч class након чега следи име класе, затим у заградама тело класе.[67]
Главна разлика изме?у деклараци?е функци?е и деклараци?е класе ?е у томе што класу мора прво да се декларише па онда да ?о? приступимо, иначе ?е се ?авити грешка (Reference Error). Класе, као и функци?е, могу бити анонимне. Значи, могу?е их ?е навести и без конкретног назива, као и правити референцу на класу.
Тако?е, класе ?е могу?е и просле?ивати као параметар или вра?ати као вредност функци?е. Функци?а ко?а прима класу као параметар, онда креира нову класу ко?а насле?у?е задату класу и ко?у онда вра?а би изгледала овако:
Укратко, гетери и сетери су функци?е ко?е служе за напредно дефиниса?е сво?ства. Оне практично представ?а?у ?прву лини?у одбране” сво?ства, тачни?е спречава?у програмере да приступа?у сво?ствима као ?голим” подацима.[67]Гетер ?е функци?а ко?а обезбе?у?е чита?е сво?ства. Шта год да ради, на кра?у мора помо?у директиве return да врати вредност ко?а онда представ?а вредност сво?ства.[67] Слично, сетер ?е функци?а ко?а се позива када се зада?е вредност сво?ства. Ова функци?а мора имати ?едан параметар ко?и представ?а задату вредност.[67] Негде ?у позадини” се та вредност бележи - на?чеш?е у неком сво?ству об?екта, ко?е се не ?експонира”. Наравно, ?аваскрипт нема механизам ко?им би се сво?ство заиста сакрило, тако да ?е у пита?у просто конвенци?а - договор.
Об?екти у ?аваскрипту има?у угра?ени механизам насле?ива?а кроз такозвано прототипско насле?ива?е. То ?е посебан стил об?ектно-ори?ентисаног програмира?а ко?и чак ни?е ни ?единствен за ?аваскрипт. Прототипско насле?ива?е се заснива на делегира?у. Сваки об?екат има сво?а сво?ства и методе, али и посебну везу ка родите?ском об?екту ко?и онда представ?а ?егов прототип од кога насле?у?е сво?ства и методе. Сувишно ?е ре?и - и та? родите?ски об?екат тако?е има сво? прототип и тако да?е. Када се приступа нпр. одре?еном методу об?екта, ако га об?екат нема, он се ?тражи” у ?еговом прототипу, па у прототипу прототипа и тако све до кра?а ланца.[68]
Конструктор ?е посебни метод ко?и се користи да би се иници?ализовао об?екат креиран у класи. У класи може посто?ати само ?едан конструктор иначе програм ?е ?авити да посто?и грешка.
Основни домен примене ?аваскрипт програмског ?езика ?есте веб програмира?е. Пре него што прегледач учита страницу, мора да направи DOM и CSSOM стабла. Прегледач анализира фа?л, заправо анализира ба?тове и од ?их прави карактере, затим груписа?ем карактера прави токене, од токена чворове, а од чворова об?екте.[69] HTML етикете се трансформишу у Об?ектни модел документа (DOM), а CSS етикете у CSS об?ектни модел (CSSOM). DOM и CSSOM су независне структуре и ?иховим спа?а?ем наста?е рендер дрво, ко?е се затим користи за израчунава?е особина сваког вид?ивог елемента, нпр. величина елемента, бо?а позадине итд. Оптимизаци?а сваког од ових корака ?е од к?учне важности за постиза?е оптималних перформанси прегледа?а. DOM опису?е садржа?, а CSSOM опису?е стил ко?и се приме?у?е. Рендер дрво садржи само чворове потребне за приказива?е странице и води рачуна о распореду и тачно? величини сваког об?екта.[70] Приликом креира?а рендер стабла, прегледач отприлике ради следе?е:
Кре?е од корена ДОМ стабла и посе?у?е сваки вид?иви чвор
Неки чворови нису вид?иви (нпр. скрипт етикета, мета тагови итд.) и ?их не приказу?е у DOM дрвету ?ер нису вид?иви на страници
Неки чворови су сакривени преко CSS-а (display: none) и они се, тако?е, не приказу?у у DOM дрвету
За сваки вид?иви чвор прегледач проналази одговара?у?а CSSOM правила и приме?у?е их
Приказу?е вид?иве чворова са садржа?ем и стилизу?е их[70]
Прегледач страну ко?у треба да прикаже третира као document, и елементима DOM стабла може се приступити помо?у document.getElemenstByTagName(). Метод .getElementsByTagName() вра?а низ елемената са тагом ко?и му проследимо. Слични методи су .getElementById(), .getElementsByClassName() и .getElementsByName(). Од претходне верзи?е ?С елементима ?е могу?е приступити помо?у document.querySelector() ко?и дохвата само први елемент ко?и се подудара са просле?еним CSS селектором или document.querySelectorAll() ко?и дохвата све елементе ко?и се подудара?у са просле?еним селектором. Уколико се жели да се до?е до HTML садржа?а неког елемента, то радимо помо?у метода .innerHTML.
Помо?у метода .textContent испису?е се текстуални садржа? неког елемента, а нови елемент се прави помо?у .createElement(). На пример:
varp=document.createElement("p");//atributu title dodeljujemo vrednost Napravljen pomocu JS-ap.setAttribute("title","Napravljen pomocu JS-a");//pravimo cvor koji sadrzi Zdravo svimavartext=document.createTextNode("Zdravo svima");//da bi ovaj cvor bio vidljiv potrebno je da ga nadovezemo na pp.appendChild(text);//medjutim, ovo i dalje nije vidljivo jer nismo sve to nadovezali na bodydocument.body.appendChild(p);
Помо?у овог механизма могу се креирати сви елементи (нпр. неуре?ену/уре?ену листу), али све то се може урадити и само помо?у HTML-а и CSS-а. Оно што ?аваскрипт разлику?е од HTML-а и CSS-а ?есте чи?еница да ?С подржава и акци?е, односно, дога?а?е ко?и се реализу?у када се клинке не неки елемент или се страница затвори итд. То ?е показано на следе?ем примеру:[71]
<!DOCTYPEhtml><html><head><title>Pridru?ivanjedoga?aja</title><metacharset='UTF-8'><styletype='text/css'>.dugme{width:200px;height:50px;line-height:50px;text-align:center;background-color:green;color:white;}.dugme:hover{cursor:pointer;background-color:blue;}</style></head><body><inputtype='button'id='dugme'value='klik za pregled poruke'onclick='prikazi_poruku()'><br/><br/><divclass='dugme'id='moderno_dugme'>klikzapregledporuke</div>;<br/><!--thisprilikomovognavodjenjapredstavljaceoinputelementpasemozepristupitisvimnjegovimsvojstvima-uovomslucajusefunkcijiprikaziprosledjujetekucitekstualnisadrzajelementa-->Unesitetekst(kadaelementizgubifokusprikazacesenjegovsadrzaj):<br/><inputtype='text'id='unos1'onblur='prikazi(this.value)'><br/>/*Preporuka je da script tag uvek pisemo na kraju body sekcije jer zelimo da imamo DOM drvo u celosti kreirano pre nego sto izvrsimo neke manipulacije*/<scripttype='text/javascript'>/* Ovakav nacin pridruzivanja podrazumeva postojanje odgovaraju?ih atributa na nivou elementa. Neki od atributa koji postoje su: onclick - definiшe sta se dogadja kada korisnik klikne na povrsinu elementa onchange - definise sta se dogadja kada korisnik promeni vrednost npr. input elementa ili select elementa onfocus - definise sta se dogadja kada element dobije fokus (kada se korisnik pozicionira bilo misem bilo tab tasterom na ovo polje) onblur - definise sta se dogadja kada element izgubi fokus onhover - definise sta se dogadja kada se predje preko povrsine elementa onkeydown - definise sta se dogadja kada korisnik pritisne taster na tastaturi (spust tastera) onkeyup - definise sta se dogadja kada korisnik pusti pritisnuti taster na tastaturi ..... ..... */functionprikazi_poruku(){//window je objekat koji predstavlja ceo prozor pregledacawindow.alert("Poruka!");}/* Ovakav nacin pridruzivanja zahteva pristup elementu i definisanje odgovarajuceg svojstva - vrednost svojstva je funkcija pa postojanje omotaca sprecava da se funkcija izvrsi odmah nakon pridruzivanja */varmoderno_dugme=document.querySelector('#moderno_dugme');moderno_dugme.onclick=function(){window.alert("Poruka!");}functionprikazi(tekst){window.alert("Novi sadrzaj je: "+tekst);}</script></body> </html>
У наставку следе неки ?едноставни?и примери примене ?Са кроз веб програмира?е.[72]
<!DOCTYPEhtml><html><head><title>Kalkulator</title></head><body>a:<inputtype="text"id="a"onkeyup="izracunaj()"><br/>b:<inputtype="text"id="b"onkeyup="izracunaj()"><br/>rez:<outputid="rez"for="a b"></output><br/><!--Inacin:<inputtype="button"value="+"onclick="izracunaj('+')"><inputtype="button"value="-"onclick="izracunaj('-')"><inputtype="button"value="*"onclick="izracunaj('*')"><inputtype="button"value="/"onclick="izracunaj('/')"><inputtype="button"value="koren"onclick="izracunaj('koren')">--><!--IInacin:--><selectid="operacija"onchange="izracunaj()"><optionvalue="+">+</option><optionvalue="-">-</option><optionvalue="*">*</option><optionvalue="/">/</option><optionvalue="koren">koren</option></select><br/><spanid="greska"></span><scripttype="text/javascript">functionizracunaj(){vara=document.getElementById("a");varb=document.getElementById("b");varop=document.getElementById("operacija").valuevarrez=document.getElementById("rez");varerr=document.getElementById("greska");a1=parseInt(a.value);b1=parseInt(b.value);if(isNaN(a1)||isNaN(b1)){if(isNaN(a1))a.focus();elseb.focus();err.textContent="Neispravni argumenti!";return;}else{switch(op){case'+':rez.value=a1+b1;break;case'-':rez.value=a1-b1;break;case'*':rez.value=a1*b1;break;case'/':if(b1==0){err.textContent="Deljenje nulom!";b.focus();return;}elserez.value=(a1/b1).toPrecision(2);break;case'koren':if(a1<0){err.textContent="Vrednost ne sme biti negativna!";a.focus();return;}elserez.value=Math.sqrt(a1);break;}}err.innerHTML="Sve je ok!";}</script></body></html>
<!DOCTYPEhtml><html><head><title>Godisnjadoba></title><styletype="text/css">img{height:200px;width:200px;}</style></head><body><imgsrc='prolece.jpg'alt="prolece"><br/><inputtype="button"value="napred"onclick="napred()"><inputtype="button"value="nazad"onclick="nazad()"><inputtype="button"value="start slideshow"onclick="slideshow()"id="slide"><scripttype="text/javascript">window.slike=newArray("prolece.jpg","leto.jpg","jesen.jpg","zima.jpg");//ovo je globalnovari=0;//ovo je takodje globalnovarelem=document.getElementsByTagName("img")[0];vartimer;functionnapred(){i=(i+1)%slike.length;elem.src=slike[i];elem.alt=slike[i];}functionnazad(){if(i-1==-1)i=slike.length-1;elsei=i-1;elem.src=slike[i];elem.alt=slike[i];}functionslideshow(){timer=setInterval("napred()",1000);varelem=document.getElementById("slide");elem.value="stop slideshow";elem.onclick=stopslideshow;}functionstopslideshow(){clearInterval(timer);varelem=document.getElementById("slide");elem.value="start slideshow";elem.onclick=slideshow;}</script></body></html>
<!DOCTYPEhtml><html><head><metacharset='UTF-8'><title>Pogadjanjereci</title></head><body>trenutnarec:<br/><inputtype="text"id="trenutnaRec"><br/>slovo:<br/><inputtype="text"id="slovo"><br/>brojpokusaja:<br/><inputtype="text"id="brojPokusaja"readonly><br/><inputtype="button"value="zameni"onclick="zameni()"id="zameni"><scripttype="text/javascript">window.tacnaRec="programiranje";window.trenutnaRecNiz=newArray();for(vari=0;i<window.tacnaRec.length;i++)window.trenutnaRecNiz[i]="*";document.getElementById("trenutnaRec").value=window.trenutnaRecNiz.join("");window.brojPokusaja=0;document.getElementById("brojPokusaja").value=window.brojPokusaja;window.brojPogodaka=0;functionzameni(){varslovo=document.getElementById("slovo").value.trim();//izdvajamo slovo i usput izbaucjemo vodece belineif(slovo.length!=1){window.alert("Morate uneti slovo!");return;}for(vari=0;i<window.tacnaRec.length;i++){if(window.tacnaRec.charAt(i)==slovo){window.trenutnaRecNiz[i]=slovo;window.brojPogodaka++;}}window.brojPokusaja++;document.getElementById("trenutnaRec").value=window.trenutnaRecNiz.join("");document.getElementById("brojPokusaja").value=window.brojPokusaja;document.getElementById("slovo").value="";if(window.brojPogodaka==window.tacnaRec.length){window.alert("Cestitamo!");return;}if(window.brojPokusaja>8){window.alert("Potrosili ste sve pokusaje.");document.getElementById("zameni").disabled=true;return;}}</script></body></html>
Неке ?аваскрипт библиотеке:
jQuery - библиотека чи?а ?е сврха да олакша употребу ?аваскрипта на веб страницама. Слоган ове библиотеке ?е ?пиши ма?е, уради више”
AJAX (asynchronous JavaScript and XML) - група ме?усобно повезаних техника за разво? веба кориш?ених на кли?ентско? страни за прав?е?е синхроних и асинхроних веб апликаци?а
Angular JS - структурални оквир за креира?е динамичких веб страница
Modernizr - ?аваскрипт библиотека ко?а детекту?е ?Html5” и Css3 сво?ства у корисничком браузеру.
На?чеш?а употреба ?аваскрипт-а ?е додава?е динамичности HTML страницама на кли?ентско? страни. Скрипте се ук?учу?у у HTML странице и врше интеракци?у са об?ектним моделом докумената (енгл. Document Object Model). Неки од примера употребе ?аваскрипт-а су:
Учитава?е одре?еног дела странице или достав?а?е података серверу преко А?АКСА (engl. AJAX) без поновног освежава?а целе странице (на пример друштвена мрежа вам омогу?ава ажурира?е новог статуса без освежава?а целе странице).
Анимира?е елемената на страници, чине?и их вид?ивим и невид?ивим, ме?а елементима величину, помера ?ихов садржа?.
Валидаци?а унетог садржа?а унутар форми, како би били сигурни да су исправни подаци послати серверу.
Интернет претраживач ?е на?чеш?е окруже?е за извршава?е ?аваскрипт кода. Интернет претраживачи обично праве хост об?екте за представ?а?е об?ектног модела докумената у ?аваскрипт-у. Поред интернет претраживача, ?аваскрипт код се може извршити и на серверу.[73]
Испод ?е минималистички пример интернет странице ко?а користи ?аваскрипт и об?ектни модел докумената.
<!DOCTYPE html><html><metacharset="utf-8"><title>Minimal Example</title><body><h1id="header">Ovo je Javaskript</h1><script>document.body.appendChild(document.createTextNode('Zdravo Svete!'));varh1=document.getElementById('header');h1=document.getElementsByTagName('h1')[0];</script><noscript>Va? pretra?iva? ne podr?ava Javaskript ili je trnutno isklju?en.</noscript></body></html>
С обзиром да ?аваскрипт код може да се изврши у различитим окруже?има, важан део тестира?а кода ?е и провера да ли ?аваскрипт код ради на више различитих претраживача.
Интерфе?с об?ектног модела докумената за манипулаци?у са интернет страницама ни?е део Екмаскрипт стандарда односно самог ?аваскрипт-а, ве? ?е дефинисан посебним стандардом. У пракси, имплементаци?а интернет претраживача се разлику?е у стандардима, и самим тим не извршава сваки претраживач ?аваскрипт код исто.
Да би се ове разлике анулирале, ?аваскрипт програмери могу да покуша?у да напишу код ко?и ?е се у ве?ини претраживача извршавати исто. Ако се не изврши, могу?е ?е написати код ко?и проверава присуство одре?ених функци?а претраживача.[74] У неким случа?евима, два претраживача могу извршити исту функци?у али са различитим исходом. Тако да програмер може практично открити шта претраживач ради и сходно томе изменити сво?у скрипту како би ?е претраживач извршио на одговара?у?и начин.[75][76]
Осим тога, скрипте не могу да раде за одре?ене кориснике. На пример корисник може да:
Користи стари или редак интернет претраживач са непотпуном или необичном подршком за об?ектни модел докумената.
Користи ПДА (engl. personal digital assistant) или претраживач на мобилном телефону ко?и не може да изврши ?аваскрипт код.
Да има онемогу?ено извршава?е ?аваскрипт-а као меру предострожности.
Како би помогли овим корисницима, програмери могу да направе интернет странице ко?е деградира?у претраживаче да не користе ?аваскрипт. Конкретно, страна би требало да остане употреб?ива без додатних елемената ?аваскрипт-а. Алтернативни приступ решава?у овог проблема ?есте да први аутор садржа?а користи основне технологи?е ко?е раде у свим претраживачима, а затим побо?ша садржа? наме?ен корисницима ко?и подржава?у ?аваскрипт. Ово ?е познато као прогресивно побо?ша?е.
?аваскрипт ?е првобитно разви?ен 1996. године ради кориш?е?а у веб претраживачу Нетске?п навигатор. Исте године Ма?крософт ?е представио имплементаци?у Интернет експлорера. Она ?е названа ?Скрипт због проблема са ауторским правима. Године 1997. ?е представ?ена прва стандардизована верзи?а ?езика под називом ЕКМАСкрипт у оквиру првог изда?а стандарда ЕКМА-252. Експлицитно верзиониса?е и ук?учива?е нових компоненти ?езика ?е било карактеристично само за Мозилу и касни?е ?е напуштен ова? принцип. Фа?ерфокс 4 ?е послед?а верзи?а овог претраживача ко?а ?е била везана за верзи?у ?аваскрипта (1.8.5). Са новим верзи?ама ЕКМА-262 стандарда, компоненте ?аваскрипт ?езика се поми?у за?едно са почетном дефиници?ом ЕКМА-262 изда?а.
Следе?а табела се заснива на информаци?ама из више извора.[77][78][79]
Shelly, Gary B.; Cashman, Thomas J.; Dorin, William J.; Quasney, Jeffrey J. (2000). JavaScript: Complete Concepts and Techniques. Cambridge: Course Technology. ISBN978-0-7895-6233-3.
Vander Veer, Emily A. (2004). JavaScript For Dummies (4th изд.). Wiley Pub. ISBN978-0-7645-7659-1.