Шта је ЈаваСцрипт и како функционише?

Реклама

ЈаваСцрипт је постао главна ставка у савременом веб развоју. Овај моћан језик еволуирао је у суштинско средство које сваки веб програмер може разумети.

ЈаваСцрипт има посебне функције које га разликују од традиционалних програмских језика. Ми ћемо истражити шта је то, како функционише и шта можете учинити са тим. Разбијемо га

Шта је ЈаваСцрипт?

ЈаваСцрипт је скриптни језик за веб. То је интерпретирани језик, што значи да му није потребан преводилац за превођење кода попут Ц или Ц ++. ЈаваСцрипт код ради директно у веб прегледачу.

Најновија верзија језика је ЕЦМАСцрипт 2018 која је објављена у јуну 2018. године.

ЈаваСцрипт сарађује са ХТМЛ и ЦСС на прављењу веб апликација или веб страница. ЈаваСцрипт подржава већина модерних веб прегледача као што су Гоогле Цхроме, Фирефок, Сафари, Мицрософт Едге, Опера, итд. Већина мобилних прегледача за Андроид и иПхоне сада подржава и ЈаваСцрипт.

ЈаваСцрипт контролише динамичке елементе веб страница. Ради у веб прегледачима, а у новије време и на веб серверима. Апликативни интерфејс за програмирање (АПИ) такође подржава ЈаваСцрипт, што вам даје већу функционалност.

Разумевање свих начина на који ЈаваСцрипт делује мало је лакше када схватите како функционише веб програмирање, па научимо више.

Блокови за изградњу веб апликација

Постоје три компоненте које граде веб странице и апликације: језик за означавање хипертекста (ХТМЛ), таблице стилова у каскадном стилу (ЦСС) и ЈаваСцрипт. Свака од њих има улогу у креирању веб апликације.

• ХТМЛ је означни језик који ствара скелет веб странице. Сви одломци, одељци, слике, наслови и текст написани су у ХТМЛ-у. Садржај се појављује на веб локацији редоследом којим је написан у ХТМЛ-у.
• ЦСС контролише стил и додатне аспекте изгледа. ЦСС се користи за креирање дизајна веб странице креирајући боје, фонта, колоне, обрубе итд. Веб локација траје од обичних текстуалних елемената до шарених дизајна.
• Трећи елемент је ЈаваСцрипт. ХТМЛ и ЦСС стварају структуру, али од тога не раде ништа. ЈаваСцрипт ствара динамичну активност на вашој апликацији. Скриптирање у ЈаваСцрипт-у је оно што контролише функције када се кликну на дугмад, како се обрасци запорки потврђују аутентичношћу, како се контролише медиј.

Сва три дела раде у хармонији међусобно на стварању апликација у пуној величини. Било би добро сазнајте више о ХТМЛ-у и ЦСС-у Научите ХТМЛ и ЦСС уз помоћ ових упутстава корак по коракИнтересује вас ХТМЛ, ЦСС и ЈаваСцрипт? Ако мислите да имате потешкоће за учење како да креирате веб локације испочетка - ево неколико сјајних туторијала које треба испробати. Опширније ако вам није потпуно пријатно.

Како функционише ЈаваСцрипт?

Пре него што напишете ЈаваСцрипт, важно је знати како то функционише под хаубом. Постоје два важна дела која треба да се науче о томе: Како функционише веб прегледач и модел документа ДОМ (ДОМ).

Веб претраживач учитава веб страницу, анализира ХТМЛ и ствара садржај који је познат као модел документа (ДОМ) из садржаја. ДОМ представља ЈаваСцрипт преглед веб странице у вашем ЈаваСцрипт коду.

Прегледник ће тада преузети све повезано са ХТМЛ-ом, попут слика и ЦСС датотека. ЦСС информације долазе из ЦСС анализатора.

ДОМ саставља ХТМЛ и ЦСС како би прво створио веб страницу. Затим ЈаваСцрипт претраживач учитава ЈаваСцрипт датотеке и линијски код, али не покреће код одмах. Чека да ХТМЛ и ЦСС заврше учитавање.

Једном када се ово уради, ЈаваСцрипт се извршава редоследом којим је код написан. То доводи до тога да се ДОМ ажурира помоћу ЈаваСцрипт кода и прегледач прегледа.

Овде је важан редослед. Ако ЈаваСцрипт не сачека да се ХТМЛ и ЦСС заврше, не би могао да промени ДОМ елементе.

Шта могу да урадим са ЈаваСцрипт-ом?

ЈаваСцрипт је пуноправни програмски језик који може учинити већину ствари уобичајеним језиком као што је Питхон. Ови укључују:

• Декларирање променљивих Како пријавити променљиве у ЈаваСцрипт-уДа бисте започели са ЈаваСцрипт-ом, морате да разумете променљиве. Ево три начина проглашавања променљивих у ЈаваСцрипт-у. Опширније .
• Чување и преузимање вриједности.
• Дефинисање и позивање функција, укључујући функције стрелице.
• Дефинисање ЈаваСцрипт објеката и класа.
• Учитавање и коришћење спољних модула.
• Писање обрађивача догађаја који реагују на догађаје на клик.
• Писање кода сервера.
• И још много тога.

Упозорење: Од ЈаваСцрипт је тако моћан језик ЈаваСцрипт и веб развој: Коришћење модела објекта документаОвај чланак ће вас упознати са костром докумената са којим ради ЈаваСцрипт. Имајући добро знање о овом апстрактном моделу објекта документа, можете написати ЈаваСцрипт који ради на било којој веб страници. Опширније такође је могуће писати злонамерни софтвер, вирусе и хакере прегледача да бисте их нанели корисницима. Они се крећу од крађе колачића, лозинки, кредитних картица прегледача до преузимања вируса на рачунар.

Коришћењем ЈаваСцрипт-а

Погледајмо неке основе ЈаваСцрипт-а са примерима кода.

Декларирање променљивих

ЈаваСцрипт се динамички куца, што значи да не морате да декларишете врсту променљивих у вашем коду.

нека је број = 5; нека миСтринг = "Здраво"; вар камата = 0,25; 

Оператори

Додатак

12 + 5. >> 17. 

Одузимање

20 - 8. >> 12. 

Умножавање

5 * 2. >> 10. 

Дивизија

50 / 2. >> 25. 

Модулус

45 % 4. >> 1. 

Арраис

нека је мојАрраи = [1,2,4,5]; нека стрингАрраи = ["здраво", "свет"]; 

Функције

ЈаваСцрипт може да пише функције, ево једноставне функције која додаје бројеве.

функција аддНумберс (нум1, нум2) { повратни број1 + нум2; } >> аддНумберс (10,5); >> 15.

Петље

ЈаваСцрипт може изводити петље за итерацију, попут петље за петље и док се петље.

за (нека је и = 0; и <3; и ++) {цонсоле.лог ("одјек!"); } >> одјек! >> ехо! >> ехо! 

нека је = 0; вхиле (и <3) {цонсоле.лог ("одјек!"); и ++; } >> одјек! >> ехо! >> ехо! 

Коментари

// Писање коментара. 

/ * Писање коментара са више линија. Можете користити онолико линија колико желите. да разбијете текст и да коментари постану читљивији. */

На веб страници

Најчешћи начин учитавања ЈаваСцрипта на веб страници је употреба скрипта ХТМЛ ознака. У зависности од ваших потреба, можете да користите једну од следећих метода.

• Учитајте екстерну ЈаваСцрипт датотеку на веб страницу на следећи начин:
• Комплетну УРЛ адресу можете да одредите ако је јавасцрипт са друге домене са веб странице на следећи начин:
• ЈаваСцрипт се може директно уградити у ХТМЛ. Ево га.

Поред ових метода, постоје и начини учитавања ЈаваСцрипт кода на захтев. У ствари, постоје оквири посвећени учитавању и покретању ЈаваСцрипт модула са одговарајућим зависностима који су решени у време извођења.

То су напредније теме, управо сада учите основе.

Примјери исјечака ЈаваСцрипт кода

Ево неколико једноставних узорака ЈаваСцрипт кода који илуструју како се користи на веб страницама. Ово су примери кода који раде са ДОМ-ом.

• Следеће одабире све одважан елемената у документу и поставља боју првог у црвену.

  вар елемс = доцумент.гетЕлементсБиТагНаме ('б'); елемс [0] .стиле.цолор = 'црвени'; 

• Желите да промените слику у ан имг таг? Следеће повезује обрађивач догађаја за кликни догађај дугмета.

  Промени слику

• Ажурирајте текстуални садржај параграфа (п) елемент? Подесите иннерХТМЛ својство елемента као што је приказано:

  Здраво Свете
  Кликни ме

Ови узорци кода нуде само увид у оно што можете учинити помоћу ЈаваСцрипт-а на својој веб страници. Постоје обиље туторијала који вас могу научити како кодирати Фреебие: Научите се кодирати са 27 сати видео туторијалаУлтимате Цодинг Бундле, који укључује пет видео курсева и 27 сати врхунског инструкције, тренутно је БЕСПЛАТАН. Опширније да започнете. Можете га испробати на било којој веб страници, чак и на овој! Отворите своју конзолу и испробајте неки ЈаваСцрипт код.

Сада знате шта ЈаваСцрипт ради

Надамо се да је овај увод донео неколико увида у ЈаваСцрипт и узбуђује вас веб програмирање. Можете све то поново унети наш згодан ЈаваСцрипт цхеат схеет Ултимате ЈаваСцрипт варалицаДобијте брзо освежавање ЈаваСцрипт елемената са овом варалицом. Опширније . Постоји много више за научити о ЈаваСцрипт-у. Једном када се осетите угодније, зашто не бисте покушали научите како се користи модел објекта објекта? Можда и будете заинтересовани да сазнају о ТипеСцрипт-у Шта је ТипеСцрипт и зашто би га програмери требали испробати?Да ли вам је ЈаваСцрипт тешко прилагодити се након учења другог програмског језика? Ево како би вам ТипеСцрипт могао помоћи при пребацивању. Опширније .