Detalyadong aralin ng JavaScript. JavaScript para sa mga Nagsisimula - Mga Simpleng Halimbawa. ▍ Deklarasyon ng klasikong function

Dahil sa popular na pangangailangan, naglulunsad kami ng serye ng mga aralin sa JavaScript. Kung determinado kang makabisado ang JS, dapat ay mayroon kang pangunahing kaalaman sa HTML at CSS, dahil ito ang pundasyon, kung wala ito ay mahirap maunawaan kung ano ang tatalakayin.

Para sa aming bahagi, susubukan kong ipaliwanag sa naiintindihan na wika, ipakita sa totoong buhay na mga halimbawa, dahil ang lahat ay natutunan sa pamamagitan ng paghahambing.

Ano ang JavaScript, o kung paano maunawaan kung anong layunin ang kinakailangan para sa pagbuo ng web!

Nabubuhay tayo sa isang mundo kung saan ang lahat ay nahahawakan, napagtanto natin ang mga ideya na pumapasok sa ating isipan. Nagtatayo kami ng mga bahay, sasakyan, at palipat-lipat gamit ang iba't ibang pamamaraan. Iyon ay, kung ano ang maaari nating gawin sa totoong mundo ay maiisip kung ihahambing sa HTML, kung saan ito ay gumaganap bilang isang materyal na gusali, ang pundasyon kung saan nakasalalay ang lahat, at sa tulong ng CSS ay idinisenyo natin ang mundong ito, ginagawa itong makulay, ang sa paraan na gusto naming makita siya para sa iyong sarili.

Marahil ay nagtataka ka kung HTML at CSS ang napapaligiran natin, kaya ano ang JavaScript? Saan ito lumilitaw sa ating mundo?

Sa tingin ko mas madaling ipaliwanag gamit ang halimbawa ng pelikulang Gary Potter, sa tingin ko marami na sa inyo ang nakapanood nito at mauunawaan kung ano ang tatalakayin. Ayon sa script ng pelikula, alam nating may super powers si Gary, isa siyang wizard, at isang magic wand ang tumulong sa kanya dito. Ang magic wand ang nagbigay sa kanya ng pagkakataong lumikha ng magic, kasing taas ng kaalaman niya para gawin itong kakaiba.

Ang JavaScript ay isang magic wand na mayroon ang bawat web developer, ngunit kung anong magic ang magagawa mo dito ay nakasalalay lamang sa kaalaman na mayroon ang developer. Ang mga nakabisado ang wikang ito ay mga wizard at tunay na gumagawa ng mga himala.

Hindi kumpleto ang JavaScript kung wala ang mga bahagi ng HTML at CSS nito. Maraming programmer ang nagbanggit ng tatlong wika na bumubuo sa "mga layer" ng isang web page: HTML, CSS, at JavaScript.

Ang HTML ay ang unang hypertext markup language - nagbibigay ito ng mga istrukturang layer, na nagpapahayag ng pag-aayos ng nilalaman ng pahina, tulad ng teksto, mga imahe, at iba pang mga elemento.

Ang pangalawa, CSS (Cascading Style Sheets), ay lumilikha ng magandang disenyo, ang hitsura ng HTML na nilalaman.

At ang pangatlo - JavaScript - nagdaragdag ng mga layer ng pag-uugali, na nagpapasigla sa web page, ginagawa itong interactive, iyon ay, lumilikha ng mga elemento para sa pakikipag-ugnayan sa mga bisita.

Bottom line, upang makabisado ang JavaScript, dapat ay mayroon kang mahusay na pag-unawa sa parehong HTML at CSS.

Ang programming ay maaaring parang hindi kapani-paniwalang mahika, na hindi maaabot ng mga mortal lamang. Gayunpaman, karamihan sa mga konsepto nito ay hindi mahirap maunawaan. Ang JavaScript ay medyo baguhan, ngunit mas kumplikado pa rin ito kaysa sa HTML o CSS, kaya sa pamamagitan ng serye ng mga aralin na ito, ituturo namin sa iyo ang mga pangunahing konsepto ng programming na maaari mong ilapat sa scripting sa JavaScript.

Magiging pamilyar ka sa mga bagong simbolo ( ), , ; , (), !, alamin ang pagtatalaga ng mga bagong salita (var, null, else if), susuriin namin ang mga patakaran ng bantas at ang syntax ng wika mismo, at lahat ng ito upang lumikha ng iyong magic.

Ang materyal ay inihanda ni Denis Gorelov, isulat ang iyong mga komento at siguraduhing ibahagi ang materyal na ito sa iyong mga kaibigan.

• Pagsasalin

Ang materyal, ang pagsasalin na aming inilalathala ngayon, ay nakatuon sa mga pangunahing kaalaman ng JavaScript at inilaan para sa mga baguhan na programmer. Maaari din itong ituring bilang isang maliit na reference na libro sa mga pangunahing konstruksyon ng JS. Dito ay tatalakayin natin, sa partikular, ang tungkol sa sistema ng uri ng data, mga variable, array, function, object prototype, at ilang iba pang feature ng wika.

Primitive Data Types Ang JavaScript ay may mga sumusunod na primitive na uri ng data: number, boolean, string, undefined, null. Dapat pansinin kaagad na kapag nagtatrabaho sa mga primitive na uri ng data, halimbawa, mga literal na string, maa-access natin ang kanilang mga pamamaraan at katangian kahit na hindi nagsasagawa ng tahasang conversion. Ang punto dito ay kapag sinusubukang gawin ang mga naturang operasyon, ang mga literal ay awtomatikong nilagyan ng naaangkop na object wrapper.▍Numbers Mayroon lamang isang uri ng numero sa JavaScript - double precision floating point na mga numero. Ito ay humahantong sa katotohanan na ang mga resulta ng pagkalkula ng ilang mga expression ay hindi tama sa aritmetika. Maaaring alam mo na sa JS ang halaga ng expression na 0.1 + 0.2 ay hindi katumbas ng 0.3. Kasabay nito, kapag nagtatrabaho sa mga integer, ang mga naturang problema ay hindi sinusunod, iyon ay, 1 + 2 === 3.

Ang JavaScript ay mayroong Number object, na isang object wrapper para sa mga numeric na halaga. Ang mga bagay na may uri na Numero ay maaaring gawin gamit ang isang command tulad ng var a = new Number(10) , o maaari kang umasa sa awtomatikong pag-uugali ng system na inilarawan sa itaas. Ito ay partikular na nagbibigay-daan sa mga pamamaraan na nakaimbak sa Number.prototype na matawag kapag inilapat sa mga literal na numero:

(123).toString(); //"123" (1.23).toFixed(1); //"1.2"
Mayroong mga pandaigdigang pag-andar na idinisenyo upang i-convert ang mga halaga ng iba pang mga uri sa isang uri ng numero. Ito ay parseInt() , parseFloat() at ang Number() construct, na sa kasong ito ay gumaganap bilang isang regular na function na nagsasagawa ng type conversion:

ParseInt("1") //1 parseInt("text") //NaN parseFloat("1.234") //1.234 Number("1") //1 Number("1.234") //1.234
Kung ang isang operasyon na may mga numero ay nagreresulta sa isang bagay na hindi isang numero (sa panahon ng ilang pagkalkula, o kapag sinusubukang i-convert ang isang bagay sa isang numero), ang JavaScript ay hindi magtapon ng isang error, ngunit kumakatawan sa resulta ng naturang operasyon bilang isang halaga ng NaN ( Hindi-isang-Number, hindi isang numero). Upang suriin kung ang isang halaga ay NaN, maaari mong gamitin ang isNaN() function.

Ang mga operasyon ng aritmetika ng JS ay gumagana sa isang napakapamilyar na paraan, ngunit kailangan mong bigyang pansin ang katotohanan na ang + operator ay maaaring magsagawa ng parehong pagdaragdag ng mga numero at pagsasama-sama ng mga string.

1 + 1 //2 "1" + "1" //"11" 1 + "1" //"11"

▍Strings Strings sa JavaScript ay mga sequence ng Unicode character. Ang mga string literal ay nilikha sa pamamagitan ng paglalagay ng tekstong ilalagay sa loob ng dobleng panipi ("") o mga solong panipi (""). Tulad ng nabanggit na, kapag nagtatrabaho sa mga literal na string, maaari tayong umasa sa katumbas na object wrapper, ang prototype nito ay maraming kapaki-pakinabang na pamamaraan, kabilang ang substring(), indexOf(), concat().

"text".substring(1,3) //ex "text".indexOf("x") //2 "text".concat(" end") //text end
Ang mga string, tulad ng iba pang mga primitive na halaga, ay hindi nababago. Halimbawa, hindi binabago ng concat() na paraan ang isang umiiral nang string, ngunit lumilikha ng bago.

▍Boolean values ​​Ang Boolean data type sa JS ay kinakatawan ng dalawang value - true at false. Ang wika ay maaaring awtomatikong mag-convert ng iba't ibang mga halaga sa isang Boolean na uri ng data. Kaya, bilang karagdagan sa logical value false , ang mga sumusunod na value ay null , undefined , "" (empty string), 0 at NaN . Ang lahat ng iba pa, kabilang ang anumang mga bagay, ay tunay na mga halaga. Sa panahon ng mga pagpapatakbo ng Boolean, anumang bagay na itinuturing na true ay na-convert sa true , at anumang bagay na itinuturing na false ay na-convert sa false . Tingnan ang sumusunod na halimbawa. Alinsunod sa mga prinsipyo sa itaas, ang walang laman na string ay mako-convert sa false at bilang resulta ng pagpapatupad ng code na ito, ang linyang This is false ay lalabas sa console.

Let text = ""; if(text) ( console.log("This is true"); ) else ( console.log("This is false"); )

Mga Bagay Ang mga Bagay ay mga dynamic na istruktura na binubuo ng mga pares ng key-value. Ang mga halaga ay maaaring primitive na mga uri ng data, bagay, o function.

Ang mga bagay ay pinakamadaling nilikha gamit ang object literal na syntax:

Let obj = ( mensahe: "Isang mensahe", doSomething: function() () )
Maaaring basahin, idagdag, i-edit at tanggalin ang mga katangian ng bagay anumang oras. Narito kung paano ito ginagawa:

• Mga katangian ng pagbabasa: object.name, object .
• Pagsusulat ng data sa mga property (kung hindi umiiral ang property na ina-access, may idaragdag na bagong property na may tinukoy na key): object.name = value, object = value.
• Pagtanggal ng mga katangian: tanggalin ang object.name , tanggalin ang object .

Narito ang ilang halimbawa:

Hayaan ang obj = (); // making an empty object obj.message = "Isang mensahe"; // adding a new property obj.message = "Isang bagong mensahe"; // editing the property delete object.message; // pagtanggal ng property
Ang mga bagay sa wika ay ipinatupad bilang mga talahanayan ng hash. Ang isang simpleng hash table ay maaaring gawin gamit ang Object.create(null) command:

Let french = Object.create(null); french["yes"] = "oui"; french["no"] = "hindi"; pranses["oo"];//"oui"
Kung kailangan mong gawing hindi nababago ang isang bagay, maaari mong gamitin ang command na Object.freeze().

Upang umulit sa lahat ng mga katangian ng isang bagay, maaari mong gamitin ang Object.keys() na utos:

Function logProperty(name)( console.log(name); //property name console.log(obj); //property value ) Object.keys(obj).forEach(logProperty);

▍Paghahambing ng mga halaga ng mga primitive na uri at bagay Kapag praktikal na nagtatrabaho sa mga primitive na halaga, maaari mong, gaya ng nasabi na, madama ang mga ito bilang mga bagay na may mga katangian at pamamaraan, kahit na hindi sila mga bagay. Ang mga primitive na halaga ay hindi nababago, at ang panloob na istraktura ng mga bagay ay maaaring magbago Mga Variable Sa JavaScript, ang mga variable ay maaaring ideklara gamit ang var, let, at const na mga keyword.

Kapag ginagamit ang var keyword, maaari kang magdeklara ng variable at, kung kinakailangan, simulan ito ng isang tiyak na halaga. Kung ang isang variable ay hindi nasimulan, ang halaga nito ay hindi natukoy. Ang mga variable na ipinahayag gamit ang var keyword ay may functional na saklaw.

Ang let keyword ay halos kapareho sa var , ang pagkakaiba ay ang mga variable na idineklara sa let na keyword ay may block scope.

Ang mga variable na idineklara gamit ang const keyword ay mayroon ding block scope, na kung saan, dahil hindi mababago ang mga value ng naturang mga variable, ay mas tatawaging "constants". Ang const keyword, na nag-freeze sa halaga ng isang variable na ipinahayag gamit ito, ay maihahambing sa Object.freeze() na paraan, na nag-freeze ng mga bagay.

Kung ang isang variable ay idineklara sa labas ng isang function, ang saklaw nito ay global.

Mga Array Ang mga Array sa JavaScript ay ipinapatupad gamit ang mga bagay. Bilang resulta, kapag pinag-uusapan natin ang tungkol sa mga array, talagang pinag-uusapan natin ang mga bagay na tulad ng array. Maaari kang magtrabaho sa mga elemento ng array gamit ang kanilang mga index. Ang mga numerong indeks ay kino-convert sa mga string at ginagamit bilang mga pangalan upang ma-access ang mga halaga ng elemento ng array. Halimbawa, ang isang construct tulad ng arr ay katulad ng isang construct tulad ng arr["1"] , at pareho silang magbibigay ng access sa parehong halaga: arr === arr["1"] . Batay sa itaas, ang isang simpleng array na ipinahayag na may let arr = ["A", "B", "C"] ay kinakatawan bilang isang bagay na tulad nito:

("0": "A", "1": "B", "2": "C")
Ang pag-alis ng mga elemento mula sa isang array gamit ang delete command ay nag-iiwan ng mga butas dito. Upang maiwasan ang problemang ito, maaari mong gamitin ang splice() command, ngunit ito ay mabagal dahil, pagkatapos alisin ang isang elemento, inililipat nito ang natitirang mga elemento ng array, sa katunayan, inililipat ang mga ito sa simula ng array, sa kaliwa.

Let arr = ["A", "B", "C"]; tanggalin ang arr; console.log(arr); // ["A", walang laman, "C"] console.log(arr.length); // 3
Pinapadali ng mga pamamaraan ng array na ipatupad ang mga istruktura ng data tulad ng mga stack at queues:

// stack let stack = ; stack.push(1); // stack.push(2); // let last = stack.pop(); // console.log(last); // 2 // queue let queue = ; queue.push(1); // queue.push(2); // hayaan muna = queue.shift();// console.log(first); // 1

Function Ang mga function sa JavaScript ay mga object. Ang mga function ay maaaring italaga sa mga variable, naka-imbak sa mga bagay o array, ipasa bilang mga argumento sa iba pang mga function, at ibalik mula sa iba pang mga function.

Mayroong tatlong mga paraan upang ipahayag ang mga function:

• Classic na deklarasyon ng function (Deklarasyon ng Function o Function Statement).
• Paggamit ng Mga Function Expression, na tinatawag ding Function Literal.
• Paggamit ng Arrow Function syntax.

▍Classic function na deklarasyon Gamit ang diskarte sa function na deklarasyon, ang mga sumusunod na patakaran ay nalalapat:

• Ang unang keyword sa linya ng deklarasyon ng function ay function .
• Dapat bigyan ng pangalan ang function.
• Maaaring gamitin ang isang function sa code bago ang deklarasyon nito dahil sa mekanismo ng pagpapataas ng deklarasyon ng function sa tuktok ng saklaw kung saan ito idineklara.

Narito kung ano ang hitsura ng isang klasikong deklarasyon ng function:

Function doSomething()()

▍Function Expressions Kapag gumagamit ng function expression, isaalang-alang ang sumusunod:

• Ang keyword ng function ay hindi na ang unang salita sa linya ng pagpapahayag ng function.
• Opsyonal ang pangalan ng function. Posibleng gumamit ng parehong anonymous at pinangalanang mga expression ng function.
• Ang mga utos para sa pagtawag sa mga naturang function ay dapat sumunod sa mga utos para sa pagdedeklara sa kanila.
• Ang ganitong function ay maaaring ilunsad kaagad pagkatapos ng deklarasyon nito, gamit ang IIFE (Immediately Invoked Function Expression) syntax.

Ang expression ng function ay ganito:

Let doSomething = function()()

▍Mga function ng arrow Ang mga function ng arrow ay maaaring ituring na "syntactic sugar" para sa paglikha ng mga anonymous na expression ng function. Dapat tandaan na ang mga naturang function ay walang sariling mga entity na ito at mga argumento. Mukhang ganito ang deklarasyon ng arrow function:

Let doSomething = () = > ();

▍Mga paraan upang tawagan ang mga function Ang mga function ay maaaring tawagin sa iba't ibang paraan. Normal na function na tawag doSomething(arguments) Pagtawag sa isang function bilang isang paraan ng object. bagong doSomething(arguments) Pagtawag ng function gamit ang apply() method doSomething.apply(theObject, ) doSomething.call(theObject, arguments) Pagtawag ng function gamit ang bind() method let doSomethingWithObject = doSomething.bind(theObject); doSomethingWithObject();
Maaaring tawagan ang mga function na may higit o mas kaunting mga argumento kaysa sa bilang ng mga parameter na tinukoy noong idineklara ang mga ito. Sa panahon ng pagpapatakbo ng function, ang mga "dagdag" na argumento ay babalewalain lamang (bagama't ang function ay magkakaroon ng access sa mga ito), ang mga nawawalang parameter ay makakatanggap ng halaga na hindi natukoy .

Ang mga function ay may dalawang pseudo-parameter: ito at mga argumento.

▍Ang Keyword na ito Ang keyword na ito ay kumakatawan sa konteksto ng isang function. Ang halaga na itinuturo nito ay depende sa kung paano tinawag ang function. Narito ang mga halaga na kinukuha ng keyword na ito, depende sa kung paano tinawag ang function (sila, na may mga halimbawa ng code, ang mga konstruksyon kung saan ginamit dito, ay inilarawan sa itaas):

• Ang isang normal na function na tawag ay window / undefined .
• Ang pagtawag sa isang function bilang isang paraan ng isang bagay - theObject .
• Ang pagtawag sa isang function bilang isang constructor ay isang bagong bagay.
• Pagtawag ng function gamit ang apply() method - theObject .
• Pagtawag ng function gamit ang bind() method - theObject .

▍Ang keyword ng argumento Ang keyword ng argumento ay isang pseudo-parameter na nagbibigay ng access sa lahat ng argumento na ginamit sa function call. Mukhang isang array, ngunit hindi ito isang array. Sa partikular, wala itong mga pamamaraan ng array.

Function reduceToSum(total, value)( return total + value; ) function sum())( let args = Array.prototype.slice.call(arguments); return args.reduce(reduceToSum, 0); ) sum(1,2 , 3);
Ang isang kahalili sa keyword ng mga argumento ay isang bagong syntax para sa natitirang mga parameter. Sa sumusunod na halimbawa, ang args ay isang array na naglalaman ng lahat ng naipasa sa function noong tinawag ito.

Function sum(...args)( return args.reduce(reduceToSum, 0); )

▍Return Statement Ang isang function na hindi naglalaman ng return statement ay babalik na hindi natukoy. Kapag ginagamit ang return keyword, bigyang-pansin kung paano gumagana ang mekanismo ng awtomatikong pagpasok ng semicolon. Halimbawa, ang sumusunod na function ay hindi magbabalik ng isang walang laman na bagay, ngunit isang hindi natukoy na halaga:

Function getObject() ( return ( ) ) getObject()
Upang maiwasan ang problemang ito, ilagay ang pambungad na kulot na brace sa parehong linya ng return statement:

Function getObject() ( return ( ) )

Ang Dynamic na Pag-type ng JavaScript ay isang dynamic na na-type na wika. Nangangahulugan ito na ang mga kongkretong halaga ay may mga uri, ngunit ang mga variable ay wala. Sa panahon ng pagpapatupad ng programa, ang mga halaga ng iba't ibang uri ay maaaring isulat sa parehong variable. Narito ang isang halimbawa ng isang function na gumagana sa mga halaga ng iba't ibang uri:

Function log(value)( console.log(value); ) log(1); log("teksto"); log((mensahe: "teksto"));
Upang malaman ang uri ng data na nakaimbak sa isang variable, maaari mong gamitin ang typeof() operator:

Hayaan n = 1; uri ng(n); //number let s = "text"; uri ng (mga); //string let fn = function() (); uri ng(fn); //function

Single-threaded execution model Ang JavaScript runtime ay single-threaded. Ito, sa partikular, ay ipinahayag sa imposibilidad ng sabay-sabay na pagpapatupad ng dalawang pag-andar (kung hindi mo isinasaalang-alang ang posibilidad ng asynchronous code execution, na hindi namin hinawakan dito). Ang runtime environment ay may tinatawag na Event Queue na nag-iimbak ng listahan ng mga trabahong kailangang iproseso. Bilang resulta, ang single-threaded JS execution scheme ay walang problema sa resource deadlocks, kaya hindi na kailangan ng locking mechanism. Gayunpaman, ang code na pumapasok sa queue ng kaganapan ay dapat na maisagawa nang mabilis. Kung na-overload mo ang pangunahing thread sa isang browser application na may mabigat na trabaho, hindi tutugon ang page ng application sa input ng user at ipo-prompt ka ng browser na isara ang page na ito sa Exception Handling JavaScript ay may mekanismo para sa paghawak ng mga exception. Gumagana ito ayon sa isang prinsipyo na medyo karaniwan para sa mga naturang mekanismo: ang code na maaaring magdulot ng error ay isinulat gamit ang try/catch construct. Ang code mismo ay nasa try block, ang mga error ay hinahawakan sa catch block.

Kagiliw-giliw na tandaan na kung minsan ang JavaScript, kapag nangyari ang mga hindi normal na sitwasyon, ay hindi gumagawa ng mga mensahe ng error. Ito ay dahil sa ang katunayan na ang JS ay hindi naghagis ng mga error hanggang sa pag-ampon ng pamantayan ng ECMAScript 3.

Halimbawa, sa sumusunod na snippet ng code, ang pagtatangkang baguhin ang isang nakapirming bagay ay mabibigo, ngunit walang pagbubukod ang itatapon.

Hayaan ang obj = Object.freeze(); obj.message = "teksto";
Ang ilan sa mga "tahimik" na mga error sa JS ay lilitaw sa mahigpit na mode, maaari mong paganahin ito gamit ang "gamitin ang mahigpit" na konstruksyon; .

Ang prototype system Ang prototype system ay sumasailalim sa mga mekanismo ng JS tulad ng mga function ng constructor, ang Object.create() command, at ang class na keyword.
Isaalang-alang ang sumusunod na halimbawa:

Let service = ( doSomething: function() () ) let specializedService = Object.create(service); console.log(specializedService.__proto__ === serbisyo); //totoo
Dito, ginamit ang Object.create() na utos upang lumikha ng isang bagay na pinasadyangService na ang prototype ay isang object ng serbisyo. Bilang resulta, lumalabas na ang doSomething() na pamamaraan ay maaaring tawagan sa pamamagitan ng pag-access sa isang bagay na pinasadyangService. Bukod pa rito, nangangahulugan ito na ang __proto__ property ng specializedService object ay tumuturo sa service object.

Gumawa tayo ngayon ng isang katulad na bagay gamit ang keyword ng klase:

Class Service ( doSomething() ) class SpecializedService extends Service ( ) let specializedService = new SpecializedService(); console.log(specializedService.__proto__ === SpecializedService.prototype);
Ang mga pamamaraan na idineklara sa klase ng Serbisyo ay idaragdag sa object na Service.prototype. Ang mga pagkakataon ng klase ng Serbisyo ay magkakaroon ng parehong prototype (Service.prototype). Ang lahat ng mga instance ay magde-delegate ng mga method call sa Service.prototype object. Bilang resulta, lumalabas na isang beses lang idineklara ang mga pamamaraan, sa Service.prototype , pagkatapos ay "minana" sila ng lahat ng pagkakataon ng klase.

▍Prototype chain Ang mga bagay ay maaaring maging "tagapagmana" ng iba pang mga bagay. Ang bawat bagay ay may prototype na ang mga pamamaraan ay magagamit dito. Kung susubukan mong i-access ang isang property na wala sa mismong object, sisimulan itong hanapin ng JavaScript sa prototype chain. Magpapatuloy ang prosesong ito hanggang sa matagpuan ang property, o hanggang sa maabot ng paghahanap ang dulo ng chain Tungkol sa Functional Programming sa JavaScript Sa JavaScript, ang mga function ay mga first-class na object, sinusuportahan ng wika ang mekanismo ng pagsasara. Binubuksan nito ang paraan sa pagpapatupad ng mga functional programming technique sa JS. Sa partikular, pinag-uusapan natin ang posibilidad ng paggamit ng mga function ng mas mataas na order.

Ang pagsasara ay isang panloob na function na may access sa mga variable na idineklara sa loob ng parent function, kahit na matapos ang parent function ay naisakatuparan.

Ang function na mas mataas ang pagkakasunud-sunod ay isang function na may kakayahang kunin ang iba pang mga function bilang mga argumento, pagbabalik ng mga function, o gawin ang pareho.

Ang functional programming sa JS ay saklaw sa maraming publikasyon. Kung interesado ka, narito ang ilang materyal sa paksang ito na nakatuon sa

Tutorial sa Syntax ng JavaScript

Bago mo simulang basahin ang tutorial sa wikang JavaScript, dapat ay may kaalaman ka sa .

Ito ay magiging isang malaking plus sa pag-aaral ng JavaScript syntax kung pamilyar ka na sa ilang programming language, tulad ng PHP, C o Pascal, at nauunawaan din kung ano ang variable, uri ng data, function o array.

Gayunpaman, kung hindi ka pamilyar sa mga programming language, hindi na kailangang mag-alala ang JavaScript tutorial na ito para sa mga nagsisimulang matuto ng programming sa unang pagkakataon.

Ang JavaScript (JavaScript) ay isang client-side programming language na maaaring magamit upang kontrolin ang mga elemento ng isang HTML page (HTML tags) at isang web browser, gawin itong ilipat, tumugon sa iba't ibang mga kaganapan (mouse clicks, keyboard presses), at lumikha ng maraming mga kagiliw-giliw na programa (mga script): mga pagsubok, animation, mga gallery ng larawan (halimbawa, tulad ng sa VKontakte), mga laro at marami pa.

Paano matutunan ang JavaScript

Ang pag-aaral ng JavaScript ay karaniwang nahahati sa apat na yugto:
1. Master JavaScript syntax (tutorial na ito),
2. Pag-aaral ng DOM at BOM,
3. Pamamahala sa DOM at BOM gamit ang JavaScript,
4. Pag-aaral ng iba't ibang JavaScript library. Ang jQuery ay ang pinakasikat na library sa ngayon (dapat lumabas ang isang jQuery tutorial sa site na ito sa katapusan ng 2015).

Ang DOM ay ang Document Object Model. Salamat sa teknolohiya ng DOM, nagsisimulang kumatawan ang mga tag ng HTML na pahina sa isang puno ng mga bagay at ang bawat bagay sa punong ito ay may sariling natatanging address. Ang wikang JavaScript, sa pamamagitan ng pag-access sa address na ito, ay maaaring ma-access ang isa o isa pang HTML na tag at manipulahin ito (baguhin ang kulay, laki, posisyon, atbp.).

Ang BOM ay isang modelo ng dokumento ng browser. Ang istraktura ay pareho sa DOM, tanging sa halip na mga HTML na bagay sa pahina, mayroong mga bagay sa browser: window ng browser, laki ng screen ng browser, kasaysayan ng pagba-browse, linya ng katayuan, atbp.

Pagkatapos pag-aralan ang DOM at BOM, nagsisimula kaming lumikha ng mas marami o hindi gaanong kumplikadong mga script ng JavaScript na nakikipag-ugnayan sa pahina at sa browser.

Pagkatapos, naging mas komportable, nag-aaral sila ng ilang library ng JavaScript, halimbawa jQuery, salamat sa kung saan maaari kang lumikha ng parehong mga programa tulad ng sa JavaScript, mas mabilis at mas mahusay lamang.

Ang ilang mga webmaster ay agad na nagsimulang mag-aral ng jQuery, laktawan ang nakaraang tatlong yugto, ngunit hindi ko ito inirerekomenda, dahil sa anumang kaso kailangan mong maunawaan ang JavaScript syntax at malaman ang mga bagay ng DOM/BOM, ang kanilang mga katangian, pamamaraan at layunin.

Anong mga programa ang maaari mong isulat gamit ang JavaScript?

Magagamit mo ito upang lumikha ng maraming kawili-wiling mga programa (mga script):
— maaari kang lumikha ng mga script na magbabago sa mga elemento ng isang pahina ng website o kanilang lokasyon sa pamamagitan ng pag-click sa isa o isa pang button,
- maaari kang lumikha ng animation,
— manipulahin ang mga form, halimbawa, suriin ang data na inilagay ng user para sa kawastuhan,
— lumikha ng iba't ibang pagsusulit, halimbawa, tulad ng Pinag-isang Estado na Pagsusuri (mga pagsusulit sa paaralan) at agad na makuha ang resulta,
— salamat sa BOM, maaari mong malaman ang mga katangian ng browser at computer ng user na bumisita sa iyong site, na nagpapahintulot sa iyo na lumikha ng iba't ibang mga counter ng pagbisita,
— gamit ang JavaScript, maaari ka ring lumikha ng mga laro, cartoon at marami pang iba pang kawili-wili at kapaki-pakinabang na mga programa.

Ano ang layunin ng tutorial na ito ng JavaScript?

Ang layunin ng JavaScript book na ito ay ituro sa iyo ang mga pangunahing kaalaman ng JavaScript syntax, na nagpapakilala sa iyo sa programming at mga konsepto tulad ng mga variable, uri ng data, pagpapatakbo, branch statement, function, loops, arrays, objects, atbp. Ang lahat ng ito ay matatagpuan sa iba pang mga programming language, kaya sa sandaling makabisado mo ang JavaScript, magiging mas madali para sa iyo na matuto ng iba pang mga wika, tulad ng PHP, C++ o Python.

Istruktura ng Tutorial sa JavaScript

Sa tutorial ng JavaScript, tatalakayin ang mga sumusunod na paksa at aralin.

• kung paano magpasok ng isang script sa isang HTML na dokumento (pangkalahatang impormasyon);
• mga komento sa JavaScript;
• kung paano magdeklara ng mga variable at bigyan sila ng mga tamang pangalan;
• script parsing at method syntax;
• alert() na paraan;
• kapaki-pakinabang na detalye: "stub" para sa pansamantalang sirang link

Mula sa may-akda

Mayroong maraming iba't ibang mga subtleties sa paglikha ng mga web page. Ngunit mayroon ding tatlong haligi. Ang mga ito ay HTML, CSS at JavaScript.

Inirerekomenda ko ang pag-aayos ng iyong self-education gaya ng mga sumusunod: sa sandaling makabisado mo ang HTML syntax at matutunan kung paano gumawa ng mga primitive na pahina na may teksto, mga larawan at mga talahanayan, agad na simulan ang pag-aaral ng CSS. Kapag naunawaan mo na kung paano magtrabaho sa CSS, simulan ang pag-master ng JavaScript, habang sabay na pinapalawak ang iyong "bokabularyo" sa lahat ng tatlong wika. Sa tingin ko, sa loob ng anim na buwan ay makakagawa ka ng napakaganda at functional na website.

Sa mahabang panahon hindi ko alam kung paano lumapit sa JavaScript. Nakakita ako ng mga aklat-aralin na masyadong abstract - teorya, teorya, at hindi malinaw kung paano ilalapat ito sa pagsasanay, o, sa kabaligtaran, masyadong tiyak: narito ang isang set ng mga handa na recipe, kunin ito at gamitin ito, ngunit kung paano ito lumalabas ay wala sa iyong negosyo.

Sa paanuman ay nakatagpo ako ng isang aklat-aralin ni Vadim Dunaev. Maraming tao, alam ko, ang pumupuna sa aklat na ito. Bilang karagdagan, nag-download ako ng isang kasuklam-suklam na na-scan na PDF, kung saan sa halip na "()" ay maaaring mayroong, halimbawa, "Q", at ang mga Latin na titik sa mga code ay pinalitan (sa mga lugar!) ng mga katulad na Ruso, kaya naman hindi gumagana ang mga code na ito. Sa pangkalahatan, kailangan kong puff. At, sa totoo lang, kung wala pa akong nabasa tungkol sa JavaScript noon, hindi ko naiintindihan ang mga error na ito at makakasama ako sa hanay ng mga pasaway. Ngunit ako ay walang trabaho sa oras na iyon, mayroon akong oras upang makapasok dito, at nagustuhan ko ang aklat-aralin. Ngunit ito ay napaka-detalyado at idinisenyo para sa mga taong nakipag-ugnayan na sa programming.

Tala 2012

Ngayon, pagkaraan ng ilang taon, isinasaalang-alang ko pa rin ang aklat-aralin na ito nang walang katulad na sigasig. Ito ay lipas na, "iniayon" para sa IE, at medyo mababaw; Mayroon ding mga tunay na error at sloppy code sa loob nito, at ang ilang mga kapaki-pakinabang na bagay ay hindi nahanap. Ngunit kumpara sa mga "loko-lokong gabay" na ginawa ng mga search engine nang sagana, ito ay isang bagay.

Kaya, gusto kong subukang pumatay ng dalawang ibon gamit ang isang bato. Sumulat ng isang bagay na naiintindihan para sa anumang teapot at sa parehong oras ay nakabubuo at pang-edukasyon. Upang ang tsarera na ito, batay sa aking payo, ay makapagsulat ng isang simple ngunit ganap na orihinal na script.

Pagpasok sa isang HTML na dokumento

Marahil ay nakita mo na ang mga sumusunod na tag sa mga HTML code:

Ang abracadabra na ito sa pagitan ng mga tag ay ang script.

Ang tag mismo ay kabilang sa HTML na wika, at maaari itong magkaroon ng mga sumusunod na katangian:

• wika
• uri

Opsyonal ang katangiang ito. Dapat itong gamitin upang linawin ang bersyon ng wika (javascript1.1, javascript1.2, atbp.), o kung gumagamit ka ng ibang wika (halimbawa,