Pielāgots raksta tulkojums "Pilna kaudze JavaScript sešu nedēļu laikā: mācību programmas ceļvedis"

Web izstrāde ir viens no vieglākajiem un populārākajiem virzieniem iesācēju programmētājiem. Strādāt diezgan ikvienam teksta redaktors Un pārlūks, nav nepieciešams studēt algoritmus progresīvā līmenī, katra programmas rakstīšanas posma rezultāts ir vizuāli - kopumā, daudz priekšrocību. Galvenās iemaņas tīmekļa attīstības kontekstā tiek uzskatīta par zināšanu JavaScript.

Tagad JavaScript attīstās ļoti ātri, un tāpēc, mācoties valodu ir viegli sajaukt. Mēs piedāvājam Jums mācību programmu ar ērtu struktūru, kas aptver visus nepieciešamos aspektus JavaScript un saistītās tehnoloģijas.

Kāpēc JavaScript?

Ir vērts atzīmēt valodas atvērtību - uzņēmumu, parasti konkurē savā starpā, sadarbojas, lai attīstītu JavaScript. Valoda ir ļoti elastīga un atbilstu gan objektu orientētas un funkcionālas pieejas atbalstītājiem. Milzīgs skaits bibliotēku un sistēmu ļauj viegli atrisināt jebkāda veida uzdevumus, un Node.JS servera platforma ļauj izmantot valodu ne tikai pārlūkprogrammā, bet arī konsolē. Jūs pat varat rakstīt galddatorus un mobilās lietojumprogrammas: Pirmkārt - ar elektronu sistēmu, un otrais ir Nativerscript vai reaģē dzimtā.

Pamati

Sākumā ir jāizpēta JavaScript, tīmekļa izstrādes un programmēšanas pamatjēdzieni: kopumā:

• objektu orientēta JS - dizaineri un rūpnīcas, mantojums;
• funkcionālais JS - augstākas kārtas funkcijas, slēgšana, recurss;
• jasmīna testa specifikācija;
• hTML, CSS un jQuery pamati.

Git.

Git ir instruments, kas nepieciešams izstrādātājiem, tāpēc tas vajadzīgs pēc iespējas ātrāk. Šeit ir pamatprasmes, kas jums ir jābūt:

• failu izveide un pārvietošana direktorijās;
• inicializācija un git;
• repozitoriju noteikšana Githubā.

Algoritmi un datu struktūras

Tad ir vērts pārbaudīt algoritmus (jo īpaši vispārējo algoritmu sarežģītības jēdzienu), kā arī pamata datu struktūras: savienoti saraksti, rindas, skursteņi, binārie meklēšanas koki un hash tabula. Tas palīdzēs jums.

Backenda

Node.js.

Pirms 10 gadiem JavaScript var izmantot tikai Frontend Development. Tagad, pateicoties Node.js, lieta neaprobežojas tikai ar vienu "priekšpusi". Mezgls ir tikai vide, lai izpildītu JS kodu servera pusē, tāpēc jums nebūs jāizpēta jaunā sintakse, bet jums būs nepieciešams importēt un eksportēt failus, sadalīt kodu moduļos un izmantot NPM paketes pārvaldnieku.

Serveri, http, express.js

Pēc mezgla mācīšanās ir jāturpina iepazīties ar backend attīstību un sakārtot serverus un maršrutēšanu. Jūs varat sākt no ostām un protokoliem ar uzsvaru uz HTTP, un pēc tam veikt Express - mezgla bibliotēku, lai apstrādātu pieprasījumus.

Asinhronā JavaScript.

Datu bāzes, shēmas, modeļi un orm

Datu bāzes ir viens no svarīgākajiem tīmekļa attīstības elementiem. Ja jūsu pieteikumam ir nepieciešams lejupielādēt vai saglabāt datus, kas nav zaudēti, atjauninot lapu, būs jāizmanto datu bāze. Ir nepieciešams iemācīties atšķirt relāciju un nesaistītās datubāzes un saprast savienojumu veidus. Tad iepazīties ar atšķirīgiem. Spēja strādāt ar Orm nebūs lieks too.

Priekšpuse

HTML un CSS.

HTML un CSS ir pamatu pamatu jebkuram tīmekļa izstrādātājam. Jums nav nepieciešams tos pazīt perfekti, bet jums vajadzētu saprast tos. Jūs varat arī izpētīt jebkuru populāru bibliotēku (piemēram, bootstrap) un CSS preprocessor, piemēram, Sass - tas palīdzēs padarīt CSS līdzīgas parastajam kodam. Lai vienkāršotu darbu ar HTML, jūs varat izvēlēties vienu no populārākajiem templatizers, piemēram, mopsis.

jQuery un manipulācijas dom

Izveidojot lapas izskatu palīdziet HTML Un CSS, jūs izmantosiet jQuery bibliotēku, lai kontrolētu DOM. Daudzi uzskata, ka jQuery ir bezjēdzīgi un drīz tiks aizstāts ar leņķi un reaģē, bet tas ir insanely populārs, un tāpēc ir vērts to zināt. Turklāt, kādu dienu jūs nokļūsiet situācijā, kad jūs būsiet neērti, lai sasniegtu reakcijas mikroskopu, un tad viegli jquery nonāks glābšanā.

Chrome izstrādātāju rīki

Būtu nepievilcīgi sadalīt hroma instrumentu uzmanību, kas dod milzīgu iespēju. Ar viņiem jūs varat studēt Dom elementus, atkļūdot konsoli, izsekot maršrutus un daudz ko citu. Šādas ir hroma konsoles ērtas iezīmes, kas vienkāršos parastās uzdevumu izpildi.

Ajax

Ja vēlaties, lai lietojumprogramma netiks atkārtoti ielādēt lapas pēc katras datu bāzes operācijas, jums noteikti būs nepieciešams Ajax - tas nosūta fona asinhrono HTTP pieprasījumus, atbildes, kurās tiek atjaunināta tikai daļa no displeja. Jūs varat strādāt ar AJAX, izmantojot jQuery, izmantojot metodi.Ajax.

Programmēšana nav tikai veids, kā nopelnīt lielu naudu, nevis pat pilnīgi garīgu darbu. Šī ir iespēja saprast, ko pasaule ap viņu sastāv, sadalās to mazās daļiņās, un pēc tam atkārtoti samontē, vadoties pēc savas loģikas un zināšanām.

Programmēšanas valodas ir tikai rīks, ar kuru persona veido noteikumus izveidotajās sistēmās.

Internets ir daudz iespēju, kurām spilgti un uzņēmīgi prāti tiek konfiscēti. Protams, tīmekļa izstrādei ir arī savi instrumenti, lai īstenotu idejas dzīvē. Viens no tiem - valoda javaScript programmēšana kas tiks apspriests šajā rakstā:

Galvenā informācija

Daudzi cilvēki pat nav saistīti ar IT-sfēru, dzirdēja vārdu Java. Revolucionārā neatkarīgā valoda valodā, kurā lietojumprogrammas aktīvi raksta mobilās sistēmas. To izstrādāja daudzsološais Sun uzņēmums, kas pēc tam šķērsoja "zem spārna" Oracle. Bet ne vienam, ne citam uzņēmumam nav nekāda sakara ar JavaScript:

No Saules ņēma tikai atļauju izmantot daļu no nosaukuma. Pārsteidzoši, JavaScript vispār nav īpašs uzņēmums.

Rakstot tīmekļa lietojumprogrammas, visbiežāk tiek izmantota JavaScript programmēšana. Ja īsi saraksts galvenās iezīmes Šī valoda ir jāizvēlas šādi:

• Objektu orientēta. Programmas izpilde ir objektu mijiedarbība;
• Datu tipu ieviešana tiek veikta automātiski;
• Funkcijas ir bāzes klases objekti. Šī funkcija padara JavaScript līdzīgu daudzām funkcionālajām programmēšanas valodām, piemēram, LISP un Haskell;
• Automātiska atmiņas tīrīšana. Tā sauktā atkritumu savākšana padara JavaScript līdzīgu C # vai Java.

Ja mēs runājam par JavaScript izmantošanas būtību, šī valoda ļauj jums "atdzīvināt" fiksētās vietņu lapas, izmantojot kodu, ko var sākt ( tā sauktie skripti). Tas ir, jūs varat veikt analoģiju ar karikatūrām, kur HTML un CSS ir priekšrocības varoņi, un JavaScript ir tas, kas padara tos pārvietoties.

Ja mēs runājam par JavaScript sintaksi, tad šādas funkcijas ir raksturīgas:

• Reģistrs ir svarīgs. Funkcijas ar FUNC () un FUNC () nosaukumiem - pilnīgi atšķirīgi;
• Pēc operatoriem, ir nepieciešams ievietot punktu ar komatu;
• Iebūvēti objekti un operācijas;
• Telpas netiek ņemti vērā. Jūs varat izmantot, cik daudz ievainojumu, kā arī virknes tulkojumi organizēt jūsu kodu.

Vienkāršākais kodekss JavaScript izskatās šādi:

Pieteikuma joma

Lai saprastu, kāpēc JavaScript ir nepieciešams, un cik daudz ir nepieciešams mācīties, dažas jomas, kurās tā tiek izmantota Šī valoda Programmēšana.

• Tīmekļa lietojumprogrammu izstrāde. Vēlaties instalēt vienkāršu skaitītāju, sakārtojiet datu pārraidi starp veidlapām vai ievietojiet savā vietnes spēlē? Tad JavaScript būs uzticīgs asistents šajā jautājumā;
• "Aktīva līdzdalība" AJAX. Šī tehnoloģija ir ievērojami paātrinājusi lietojumprogrammas, izmantojot datu apmaiņu ar serveri "fona" režīmā:

• OS. Varbūt kāds nezināja, bet logi, Linux un Mac ir pārlūkprogrammas konkurenti, lauvas daļa no koda daļas ir rakstīts JavaScript;
• Mobilās lietojumprogrammas;
• Apmācības apjoms. Jebkura programmētāja specialitāte universitātē ietver JavaScript pētījumu vienā vai otrā veidā. Tas ir saistīts ar to, ka valoda sākotnēji tika izstrādāta ne ļoti spēcīgiem programmētājiem. JavaScript nodarbības ir loģiski austi uz bāzes HTML kursu, tāpēc attīstība ir pietiekami vienkārši.

Priekšrocības un trūkumi

Nedomāju, ka JavaScript ir sava veida panaceja no visām problēmām, un katrs programmētājs ar smaidu uz sejas bauda šo valodu. Viss pasaulē ir savas pozitīvās un negatīvās puses. Lai sāktu, mēs atzīmējam trūkumus.

• Nepieciešamība nodrošināt pārrobežu pārlūku. Tā kā JavaScript darbojas kā interneta tehnoloģija, tad jums ir jāsagatavo ar noteikumiem, kas izveido World Wide Web. Kods jāveic pareizi visos vai vismaz populārākajos pārlūkprogrammās;
• Mantojuma sistēma valodā rada grūtības saprast, kas notiek. JavaScript īstenoja mantojumu, pamatojoties uz prototipiem. Cilvēki, kuri pētīja citas objektu orientētas programmēšanas valodas, ir pieraduši uz parasto " klase pēcnācējs manto vecāku klasi" Bet JavaScript, šādas lietas ir iesaistītas objektos tieši, un tas nav piemērots galvu;
• Nepastāvīgs standarta bibliotēka. JavaScript nesniedz nekādas iespējas strādāt ar failiem, I / O plūsmām un citām noderīgām lietām;
• Sintakse kopumā ir grūti saprast. Kodeksa skaistums nepārprotami nav JavaScript, bet tiek ievērots galvenais programmētāju noteikums: " Darbojas? Nemēģini!».

Tagad ir vērts atzīmēt dažas priekšrocības

• JavaScript nodrošina liels skaits iespējas atrisināt dažādus uzdevumus. Valodas elastīgums ļauj izmantot vairākas programmēšanas veidnes attiecībā uz konkrētiem nosacījumiem. Izgudrojuma prāts saņems šo prieku;
• JavaScript popularitāte atver ievērojamu daudzumu gatavu bibliotēku pirms programmētāja, kas ļauj ievērojami vienkāršot koda rakstīšanu un sintakses nepilnību līmeni;
• Pieteikums daudzās jomās. Plašas JavaScript funkcijas sniedz programmētājiem iespēju izmēģināt sevi kā plašas lietojumprogrammu izstrādātāju, un tas noteikti ir interese par profesionālo darbību.

Nepievērsiet uzmanību tam, ka mīnusi izrādījās vairāk nekā priekšrocības. JavaScript stingri fiksēts viņa nišā, un no turienes nav kritikas Šis brīdis Neizvēlas.

Tiem, kas vēlas mācīties

Grūti un ilgs ceļš būs tiem, kas nolēma rūpīgi apgūt JavaScript. Iesācējiem ir pamata ieteikumi, pēc kuriem, ir iespējams ievērojami vienkāršot savu apmācību.

• Pirmkārt, HTML. Nav iespējams sākt kaut ko darīt internetam bez pamatiem pamatiem. Būs ļoti noderīgas arī cascading stila loksnes (CSS);
• Izmantojiet jaunu literatūru. Programmēšana nav fizika, kuru likumi ir neaizstājami, un jaunas mācību grāmatas tiek sagrieztas vecās. IT tehnoloģijas pastāvīgi attīstās, un to nedrīkst atstāt novārtā ar noderīgiem atjauninājumiem;
• Lai mēģinātu uzrakstīt visas programmas sadaļas. Ja kaut kas nav vispār tas izrādās - jūs varat aizņemties kāds cits kodu, bet tikai iepriekš izpratne par sevi katru līniju;
• Atkļūdošana ir jūsu uzticīgais draugs. Ātri atrast kļūdas - vienu no svarīgākie punkti programmās;
• Nelietojiet ignorēt formatēšanas normas. Protams, kods nebūs labāk vai sliktāks no cita skaita ievilkumu un atstarpēm, bet arī programmētāja lasīšanas un izpratnes vieglums ir arī svarīgs brīdis. Zemāk esošo kodu? ļoti grūti uztverta, it īpaši, ja neesat viņa

• Mainīgajiem nosaukumiem jābūt leksiskai vērtībai. Rakstīšanas procesā vienkāršas programmas Šķiet, nav svarīgi vispār, bet tad, kad koda rindu skaits pārsniedz tūkstošus - visi velni lauza kājas;

JavaScript ir pastāvīgi attīstās valoda, jo īpaši tagad, kad ir izveidots ikgadējs ECMAScript specifikāciju atjaunināšanas grafiks. Šajā sakarā, JavaScript zināšanu nozīme ārpus jQuery palielinās.

Protams, šajā rakstā mēs nevarēsim segt visu nepieciešamību zināšanu. Protams, būs mirkļi, ko es nokavēju, varbūt es kļūdaini vai mūsu viedokļi ar jums par nepieciešamo zināšanu kopumu atšķirsies.

Ņemot vērā šos aspektus, sāksim ...

Kas ir Fizzizbiz tests

Fizzizzizz - Parasti neliels tests, kas paredzēts nepieredzējušiem izstrādātājiem. Es domāju, ka jums būs pārsteigts, cik JavaScript izstrādātāji nezina, kā rakstīt šādus testus.

Parasti šādiem testiem nav liela jēgas slodze. Tas ir vērsts tikai, lai pārbaudītu potenciālo kandidātu spējas.

Atcerieties, ka, visticamāk, jums tiks lūgts veikt līdzīgu pārbaudi uz interviju, ir ļoti liels.

Klasiskās Fizzizbizz testa piemērs:

Šādu testu iespējas ir neierobežotas. Pēc tam, kad intervijā es uzcēlu šādu pārbaudi, pēc tam man bija jārisina vēl divas iespējas.

Par (var i \u003d 1; i<= 100; i++) { if (i % 15 == 0) { console.log("FizzBuzz"); } if (i % 3 == 0) { console.log("Fizz"); } if (i % 5 == 0) { console.log("Buzz"); } }

Atšķirība starp \u003d\u003d un \u003d\u003d\u003d

Jūs, iespējams, esat iepazinušies ar abiem salīdzināšanas operatoriem. Tomēr jūs zināt, ko tieši šie operatori atšķiras? Jūsu JavaScript Linter prasa jūs pieteikties operatoram \u003d\u003d\u003d, brīnījās, kāpēc?

Tā vietā nav salīdzināt operandu veidus, tas noved pie viena veida. Šādai operācijai ir negatīva reputācija.

Konsole.Log (24 \u003d\u003d "24"); // TRUE.

Kā jūs redzat, virkne vērtību 24 (vienas pēdiņās) tika dota veselam skaitlim. Protams, ir situācijas, kurās jūs precīzi un vai vēlaties, bet visbiežāk, vai vēlaties vadīt salīdzināšanas operatora manipulētos datu tipus. Salīdzinot datus, izmantojot operatoru \u003d\u003d nav ieteicams, lielākā daļa sistēmu, lai pārbaudītu JavaScript stila kodu, jūs norādīsiet uz šo kļūdu.

\u003d\u003d\u003d (Stingri salīdzinājums) salīdzina datu tipus, nepārvietojot tos uz vienu tipu, tas ir, dati tiks salīdzināti, kā tas ir. Tā arī, tā kā veidi nav iesaistīti šajā operācijā, tas darbojas ātrāk. Lai šis operators būtu pareizi, būs nepieciešams viena veida operatori.

Tas pats piemērs, bet ar operatoru \u003d\u003d\u003d

Konsole.Log (24 \u003d\u003d\u003d "24"); // FALSE

Atbildot, mēs iegūstam nepatiesu, jo dažādu veidu operandi viens no tiem ir vesels skaitlis, un otrā virkne.

Kā izvēlēties DOM elementus bez papildu bibliotēkām

Protams, jūs esat iepazinušies ar to, kā padarīt paraugu elementiem, izmantojot jQuery, bet vai jūs varat darīt to pašu, bet bez šīs bibliotēkas palīdzības?

Es domāju ne tikai izvēlēties vienumu ar konkrētu ID vai klases kopumu, es runāju par izteicieniem, lai meklētu priekšmetus, izmantojot jQuery.

Ir vairākas dzimtās metodes, lai meklētu DOM elementus, kas nav sliktāki par jQuery. Mēs varam izmantot arī pirmās bērna, pēdējā bērna tipa selektorus utt.

Iepazīstieties ar dažām no šīm metodēm

• document.GetElementByid ir klasisks metode, lai atrastu vienumus pēc viņu ID.
• document.getElementsBlassName - izvēloties elementus par klases nosaukuma lauka vērtību
• document.queryselector ir lieliska metode, kas praktiski pilnībā aizstāj $ () selektoru no jQuery, bet tas jau ir iekļauts JavaScript. Vienīgā atšķirība ir tā, ka tā atgriež tikai pirmo atrasts elements.
• document.QuerySelectorall - iepriekšējās metodes analogs, bet atgriež atrasto objektu klāstu.
• document.getElementsBytagname - šī metode palīdzēs jums izvēlēties elementus ar tagu. Ja jums ir nepieciešams atrast visus DIV vienumus, tad jums ir nepieciešama šī metode.

Es arī vēlos atzīmēt, ka Queryselector un Queryselectorall metodes var izmantot ne tikai uz visu dokumentu, bet arī uz atsevišķiem priekšmetiem, tas ir, jūs varat veikt paraugu vienā no mātes elementā.

Mozilla dokumentācijā jūs atradīsiet pilnīgu šo metožu aprakstu.

Veicināt mainīgo un funkciju reklāmas

JavaScript ir ieinteresēts, kā tas apstrādā deklarētos mainīgos lielumus un funkcijas, visi automātiski palielina darbības jomu. Tādējādi jūs varat atsaukties uz tiem pirms to reklāmām redzamības jomā (piemēram, JavaScript funkcijām ir savas darbības jomas).

Tāpēc, lai lasītu kodu, veiciet noteikumu, lai vienmēr deklarētu mainīgos lielumus darbības jomas sākumā. Ja jūs norādāt "izmantot stingru" augšpusē skripta vai funkciju, tad, piekļūstot nevajadzīgu mainīgo, jūs saņemsiet kļūdu.

Lielākā daļa instrumentu, lai pārbaudītu koda stilu, piemēram, JShint, norādīs jums kļūda, ja jūs neizmantojat "lietošanu stingru", pamatojoties uz to, ja jūs mēģināt uzrakstīt labu kodu, tad jūs neizmantosiet mainīgos jebkurā gadījumā uz reklāmu. Kā vienmēr, ja ir jautājumi, sazinieties ar Mozilla dokumentāciju, tur vienmēr atradīs pilnīgu un visaptverošu jūsu problēmas aprakstu.

Izmantojot izstrādātāju rīkus pārlūkprogrammā

Visbiežāk šie instrumenti tiek izmantoti, lai atkļūdotu JavaScript skriptus, bet to funkcionalitāte nav ierobežota. Piemēram, jūs varat izmantot apstāšanās punktu, veiciet skriptu soli pa solim, ievadot katru funkciju vienlaicīgi.

Šie rīki nodrošina neaizstājamu palīdzību, jo jūs varat pilnībā izsekot jūsu pieteikuma darbību un atrast grūtībās nonākušos apgabalus.

Gājīties, lai pieteiktos izstrādātāju rīkus šādās pārlūkprogrammās kā Chrome, Firefox un jaunākās versijas Internet Explorer, jūs varat atkļūdot skriptu, izmērīt savu ātrumu un atrast vietas, kur ir vērts uzlabot darba algoritmu.

Nekad nemēģiniet debitēt kodu akli, jūs vispirms analizējat to, izmantojot izstrādātāju rīkus. Neformālo problēmu risināšana ir bezjēdzīga pavadīšana.

Konsoles komandas

Ieslēdziet nākamo izstrādātāju rīku izpēti. Kā likums, viņi visi piedāvā konsoli, kurā jūs varat inhibēt JavaScript kodu.

Protams, jūs jau esat iepazinušies ar šādām komandām kā konsole.Log un konsole.Error, bet tas neaprobežojas tikai ar konsoles funkcionalitāti.

Es vēlos uzreiz atzīmēt, ka ne visas uzskaitītās komandas strādās visās pārlūkprogrammās. Es centīšos pieminēt tikai tos, kas strādā mūsdienu pārlūkprogrammās. Tomēr kā Padome es teikšu, ka pirms to piemērošanas mēģiniet sevi pārbaudīt savu sniegumu, lai velosipēds nav āmuru kodu.

• console.log - izmanto, lai uzturētu notikumu žurnālu. Atbalsta formatējumu.
• console.Error - lai reģistrētu kļūdas kodā. Es izmantoju šo komandu, ja kļūdas rodas Ajax vaicājumos un citās potenciāli bīstamās koda daļās. Metode ir līdzīga iepriekšējam, bet tas parāda sarakstu ar kaudzēm.
• konsole.dir (objekts) - parāda formatēto objekta saturu. Kā izmantots, šī metode ir ļoti noderīga, atkļūdojot kodu.
• console.Group (nosaukums) - ļauj izveidot ziņojumu grupu žurnālā, ko sauc par nosaukumu. Tādā veidā jūs varat grupēt ziņojumus, piemēram, ar segmentu kodu, kur tie tiek ģenerēti.
• console.GroupcollPased ir analogs iepriekšējo komandu vienā izņēmumā. Proti, tas parāda ziņojumus salocītā formā.
• console.Groupend - beidz iepriekš izveidoto grupu.
• console.Time (etiķete) - ļauj izsekot ātrumu vietnes milisekundēs. Metode ir noderīga, izmantojot potenciāli sarežģītus kodu sadaļas.
• console.Timeend (etiķete) ir analogs Grupas metodi, bet tas darbojas saistībā ar konsoli.Time ().
• kopēšana (virkne) - konsolē Chrome un Firefox ir metode, kas ļauj kopēt virknes saturu starpliktuvē. Ļoti noderīga metode, mēģiniet to piemērot.

Kas tieši ir iekļauts šajā

Pirmkārt, tas ir liels problēmu avots tiem, kas pilnībā nesaprot, kas tieši satur šo atslēgvārdu. Un būt kļūdaini šajā ļoti vienkāršā, jo tā saturs ir pilnībā atkarīgs no koda struktūras.

Tradicionālajās programmēšanas valodās tas satur atsauci uz pašreizējo klases objektu. Bet, tā kā JavaScript ir tālu no tradīcijām, tad tajā šis mainīgais attiecas uz objekta vecāku objektu.

Vieglākais veids, kā saprast, ir ņemt to par īpašnieku vai vecāku metodi. Tas vienmēr attiecas uz vecāku (vecāku), izņemot gadījumus, kad izmantojat zvanu, piemērojiet vai saistīt metodes.

Nākamajā piemērā to atsaucas ar logu:

Funkcija manufunciju () (konsole.log (šis \u003d\u003d\u003d logs); // true) mana darbība ();

Protams, jums ir jautājums, kā tas var būt vienāds ar logu, ja mēs to pārsūdzējam metodē? Ja jūs zināt atbildi uz šo jautājumu, tad pilnīgi, citādi lasiet un es centīšos izskaidrot.

Atzīmējot funkciju šādā veidā, tas ir pievienots pasaules loga objektam. Atcerieties, vai mēs sakām, ka tas attiecas uz metodes metodi?

Mainot vērtību, kas ir pilnībā jauns objekts (nevis logs):

Funkcija manufunciju () (konsole.log (šis \u003d\u003d\u003d logs); // false) jauns manfūris ();

Koeficienters no tīrības koda pārliecināts šoks no šāda piemēru. Mēs vienkārši dodamies uz aisberga augšdaļu ar šādiem piemēriem. Kā redzat, šī vērtība vairs nav vienāda ar logu.

Kāpēc tas notika?

Vienkāršākais skaidrojums - otrajā piemērā mēs izmantojām atslēgvārdu jaunu, šo lielāko daļu mēs izveidojām jaunu jomu un jaunu objektu.

Nākamajā piemērā mēs izveidosim fiktīvu API izkraut datus no bibliotēkas no servera. Mēs izveidosim API objektu ar dažām metodēm.

Lietojot vārdu jauno, skriptu konteksts pārvietojas no loga konteksta uz API.

Var api \u003d (GetData: funkcija () (konsole.Log (šis \u003d\u003d\u003d logs); // viltus konsole.Log (tas \u003d\u003d\u003d API); // TRUE)); Ap.getdata ();

Kā jūs redzat, vērtība ir pilnībā noteikts metodes metodē. Tā kā funkcija tiek saukta par API objektu, tās vecāku, tad to vērtība ir atsauce uz API objektu.

Atcerieties, ka šīs vērtības izmaiņas. Tas atšķiras atkarībā no zvanu metodes, bet, ja jūs izmantojat saistību metodi, vērtība ir nemainīga.

Sīkāk ar atslēgvārdu JavaScript, jūs varat iepazīties rakstā Quirkmode un dokumentāciju no Mozilla.

"Izmantot stingru";

Kā jau iepriekš minējām iepriekš, lietotāja stingrais tiek izmantots, lai uzklātu stingrāku JavaScript valodas versiju. Šī direktīva tiek ievērota, lai pieteiktos visos skriptus.

Pēc noklusējuma JavaScript ir diezgan brīvs savā sintaksē. Tas vienkārši palaisīs kļūdainu koda sadaļu un mēģinās izpildīt šādas rindas, vienlaikus pateicot jums kaut ko.

Mozilla dokumentācijā ir viss raksts par šo tēmu, es stingri iesaku tikties ar viņu.

Dažāda veida cikli

Jūs būsiet pārsteigti, bet es tikos ar lielu skaitu izstrādātāju, kuri nezināja, kā pareizi izmantot ciklu un absolūti nedzirdēja par citiem ciklu veidiem. Un varēsiet izmantot ciklu uz masīva vai objekta - ļoti svarīga prasme attīstītājam. Nav skaidras instrukcijas, kad un ko piemērot cikla veidu, bet jums vajadzētu pārvietoties šajā jautājumā. Protams, jūs esat pazīstams ar un, bet ko par citiem?

Ciklu saraksts JavaScript:

• for..in
• for..of (pievienots ES6)
• katram.
• kamēr
• darīt kamēr

Cikls

Absolūti obligāts cikls, kas nepieciešams zināt un saprast. Tas veic savu ķermeni, veicot 2. stāvokli.

Par (1. nosacījums; 2. nosacījums; 3 nosacījums) (// jūsu kods)

1. nosacījums - izpildīts vienu reizi pirms ciklu sērijas sākuma. Vairumā gadījumu šeit jūs inicializēt ciklu skaitītāju šeit. Šo vienumu var palaist garām, ja jūs inicializēt agrāk.

2. nosacījums - šis nosacījums tiek izmantots, lai noteiktu, lai turpinātu ciklu vai nē. Jūs, iespējams, salīdzināt savu skaitītāju ar masīva izmēru. Ja patiesā salīdzinājuma vērtība turpinās. Ja jūs pārtraucat ciklu iekšpusē ar pārtraukumu, tad šo stāvokli var izlaist.

3. nosacījums - šī vietne tiek izpildīta pēc katras iterācijas, kā likums, tas ir šeit, ka jūs palielināt savu skaitītāju.

Cikls ... in

Šāds ir cikla veids. Ar to jūs varat iet cauri visām klases laukiem.

Ļaujiet mums sniegt piemēru.

VAR Persona \u003d (Vārds: "Dwayne", uzvārds: "Charrington", Vecums: 27, Starsign: "Ūdensvīrs"); // zemāks cilpa izejas: // "dwayne" // "Charrington" // 27 // "Ūdensvīrs" par (ja (person.hasownproperty (p)) (konsole.Log (persona [p]);))

Cikls ... no

Diezgan jauna veida cikla tika pievienots ES6. Saskaņā ar savu jaunumu, neatbalsta visas pārlūkprogrammas. Bet, izmantojot noteiktas tehnoloģijas, to var izmantot jau šodien.

Šis cikls ir pilnīgs pretējs ... in, tas iet caur lauka vērtībām un darbojas tikai ar datu tipiem, kas atbalsta iterācijas uz kuru objektu neattiecas.

Var augļi \u003d ["apelsīnu", "ābols", "skvošs", "bumbieris"]; Par augļu augļiem) (konsole.log (augļi);)

Šāda veida cikla lielais plus ir tas, ka mums vairs nav nepieciešams izveidot rādītāju un sekot masīva garumam, lai pilnībā izmantotu tās elementus.

Foreach cikls

Vēl viens cikla veids, kas tās dziļumā neatšķiras no iepriekš uzskaitītajiem ciklu veidiem.

Tas darbojas tikai ar blokiem, nevis objektiem. Tas ir izdevīgi, ka jums nav jāizveido papildu mainīgie, kas galu galā piesārņo jūsu kodu. \\ T

Protams, tas ir ierobežotākais cikla veids, bet tai ir savi pieteikumi, par kuriem būs zināms, ka:

Var augļi \u003d ["Apple", "banāns", "oranžs", "vīnogas", "bumbieris", "passionfruit"]; // Trīs vērtības uz atzvanīšanas funkciju ir: // elements - elements ir Traverse // indekss - pašreizējais posteņa indekss masīvā, sākot no 0 // masīva - masīvs ir traversa (iespējams, pārsvarā nav nozīmes) Augļi. Fureach (funkcija (elements, indekss, masīvs) (konsole.Log (indekss, elements);));

Dažreiz jums vienkārši ir jāiet cauri visiem masīva elementiem un, iespējams, veikt dažas izmaiņas. Viņa uzvedība ir līdzīga jquery.each.

Viens šāda veida ciklu trūkums - to nevar pārtraukt. Ja jums ir nepieciešams izveidot ciklu saskaņā ar ES5 noteikumiem, tad izmantojiet ARRAY.EVERY metodi, lai iepazītos ar kuru jūs varat Mozilla dokumentācijā.

Ciklā

Kamēr cikls ir līdzīgs, bet tas tikai pieņem vienu parametru - stāvokli, ar kuru cikls nosaka, lai turpinātu iterācijas vai apturēt tos.

Lai gan šāda veida cikls tiek uzskatīts par visstraujāk, es domāju, ka šis brīdis ir diezgan pretrunīgs. Es domāju, ka jūs neapgalvosiet, ka šāda veida cikls neizskatās uzmanīgi nekā citi, un tā ātrumu var izskaidrot tikai ar iekšējās loģikas vienkāršību.

Saskaņā ar pieredzi, es teikšu, ka ātrākā versija cikla laikā ir cikls ar samazinājumu skaitītājā, jūs samazināt to uz vienību, līdz jūs sasniedzat nulli (kas tiek arī pieprasīts).

Var i \u003d 20; Kamēr (i--) (konsole.Log (i);)

Cikls ... kamēr

Šāds cikls ir diezgan reti, bet joprojām ir vērts iepazīstināt viņu, lai saprastu savu darbu.

Cikls cikls nedrīkst veikt nekādu atkārtojumu. Tas ir, ja jūs nododat nepatiesu vērtību kā cikla stāvokli, tad netiek izpildīts atkārtojums. Kamēr cikls ir garantēts, lai izpildītu vismaz vienu darbību.

Šī atšķirība nav beigusies. Kamēr cikls apstrādā stāvokli pirms atkārtošanas, un dara ... bet pēc tam.

Kā vienmēr, Mozilla dokumentācijā jūs atradīsiet detalizētu šāda veida ciklu aprakstu.

Galvenās metodes un uzdevumi

JavaScript pastāv pamatprincipi, kas būtu jāzina. Attiecībā uz darbu ar masīviem un rindām JavaScript piedāvā lielu iebūvēto metožu komplektu. Mēs pieskartos tikai masīviem un līnijām, atstājot objektus vēlāk.

Ja jūs interesē strādāt ar citiem datu veidiem, tad droši sazinieties ar Mozilla dokumentāciju. Protams, jums nevajadzētu zināt visas šīs metodes ar sirdi, es aprakstīšu tikai tos, kas šķiet nepieciešami.

Darbs ar virknēm

JavaScript, jūs visbiežāk strādājat ar virknes datiem, izņemot, iespējams, blokus un objektus. Pat ja jūs nestrādājat ar rindām, vai domājat, ka jūs nedarbojas, tad joprojām ir vērts iepazīties ar šīm metodēm.

• String.Replace (regexp | Ko nomainīt to, ko aizstāt, atzvanīt) - ļauj aizstāt daļu no līnijas, ir atļauts izmantot regulāras izteiksmes.
• String.concat (Storok 1, līnija 2 ...) - vairāku līniju savienojums vienā.
• String.indexof (vērtība) - metode ļauj jums atrast secības skaitu simbolu vēlamo daļu līnijas, -1 - ja virkne nav atrasts
• String.slice (Startindex, Endindex) - atgriež virknes zonu no Startindex līdz Endindex
• String.Split (separators, limits) - sadalās virkni ar separatora simbolu, maksimālo robežu garumu.
• String.SubsCTR (Startindex, garums) - atgriež daļu no virknes, sākot ar Startindex garumu.
• String.tolowercase - tulko visas virknes rakstzīmes mazajiem burtiem
• String.Touppercase - pārnes visas virknes rakstzīmes augšējā reģistrā
• String.trim - noņem atstarpes no līnijas sākuma un beigām

Darbs ar masīviem

Jums bieži būs jāsaskaras ar masīviem. Viņi ir pierādījuši sevi kā veidu, kā uzglabāt datus. Šīs metodes ir tieši vērts zināt jebkuru JavaScript izstrādātāju, jums nevajadzētu meklēt tos Google.

• Array.Pop vada pēdējais elements un noņem to no masīva.
• Array.Shift - atgriež pirmo elementu un noņem to no masīva.
• ARRAY.PUSH (VAL1, VAL2) - pievieno vienu vai vairākas vērtības uz masīva beigām. Atgriež jaunu masīva garumu.
• Array.Reverse - spoguļošana maina masīva elementu secību.
• ARAY.Sort - ļauj šķirot masīvu, izmantojot savu funkciju.
• Array.join (atdalītājs) - atgriež virkni, kas sastāv no masīva elementiem, kas atdalīti ar atdalītāja simbolu (noklusējuma - komatu).
• ARRAY.Indexof (vērtība) - atgriež indeksu elementa masīvā, -1, ja prece nav atrasts.

Tas nav pilns saraksts ar metodēm, lai strādātu ar masīviem. Ar citiem varat izlasīt Mozilla dokumentāciju. Sākot ar ES6, ir pievienotas ļoti interesantas metodes.

Atšķirība starp zvanu un piemēro

Šīs divas metodes ir sajaukt diezgan bieži. Bieži vien jūs varat darīt bez tiem, bet tie palīdz izsaukt metodes un mainīt vērtību šī izpildes laikā.

Starpība starp tām ir diezgan maza, bet tā pastāv. Izmantojot zvanu metodi, varat iestatīt bezgalīgu argumentu skaitu, sadalot tos ar komatu.

Izmantojot lietojumprogrammas metodi, varat pārsūtīt argumentus kā masīvu un mainīt šo vērtību.

Ja jums ir nepieciešams, lai vienkārši pārsūtītu masīvu kā argumentu metodi, tad sākot ar ES6 uzlabotas (izplatīšanas) operatoru. Tas neļauj to mainīt. Jūs varat iepazīties ar viņu, kā vienmēr oficiālajā dokumentācijā no Mozilla.

Zvanu piemērs:

Funkcija myfunc () (konsole.log (argumenti);) myfunc.call (tas, 1, 2, 3, 4, 5);

Piemērot piemēru:

Funkcija myfunc () (konsole.log (argumenti);) myfunc.call (,);

Iepazīšanās ar bibliotēkām un sistēmām

Šodien visvairāk pamanāmie JavaScript sistēmu pārstāvji ir angularjs, react.js un emper. Protams, joprojām ir vairāki citi.

Tā kā tīmekļa lietojumprogrammas kļūst arvien vairāk, šīs bibliotēkas vienkāršo darbu ar viņiem. Ir vērts saprast, ka tagad, zinot, ka viens jQuery nav pietiekami. Lielākā daļa vakanču ir noteiktas zināšanas par papildu JavaScript bibliotēkām kā galveno prasību.

Node.js.

Nav šaubu, ka node.js aizņem cietu pozīciju. Praktiski jebkurš front-end rīks ir veidots uz node.js un izmanto NPM (mezgla pakete pārvaldnieks), ja tas ir nepazīstams, es stingri ieteiktu jūs labot šo bezdarbību. Tā kā node.js izmanto JavaScript, tad mācīšanās tas nerada īpašas grūtības tiem, kas jau ir pazīstami ar šo valodu. Jums būs vairāk laika, lai izveidotu mezgla paketes, nekā rakstīt kodu pati.

Personīgi, es domāju, ka ar mezglu ir jāparaksta katrs attīstītājs 2015. gadā. Es nerunāju par dziļām zināšanām, ir pietiekami, lai varētu to piemērot servera izstrādei, prototipēšanai, testēšanai utt.

Ir dakša node.js sauc IO.JS, šodien tie ir praktiski analogi, un beigās jūs vienkārši rakstīt JavaScript, izņemot nelielas atšķirības.

Testēšana

Kad mēs vispār neesat pārbaudījuši JavaScript kodu, jo viņi to neuzskatīja par nepieciešamu. Bet skripti kļūst arvien vairāk pateicas angularjs un node.js.

JavaScript attīstās, un skriptu pieaugums un testēšana kļūst būtiska. Ja jūs nepārbaudāt savu kodu, tad jūs nepareizi. Mans mīļākais testeris ir karma. Ir citi, bet šis konkrētais ir pierādījis sevi labāk nekā ikvienam, strādājot ar angularjs. Un, ja tas ir piemērots angularjs, tad tas ir piemērots man.

Instrumenti

Būdams JavaScript izstrādātājs 2015. gadā nozīmē ne tikai lieliskas valodas zināšanas, bet arī liels skaits rīku, lai strādātu ar to.

Dažreiz rīki ietver sev pārlūku, ko mēs izmantojam. Un dažreiz jums ir jāatsaucas uz trešo pušu rīkiem, lai iegūtu dziļāku situācijas analīzi.

Šeit ir rīku komplekts, kas jums jāatceras: Gulp, WebPack un Babeljs. Ir daudz vairāk rīku, bet rīki, piemēram, gulp un grunt palīdzēt jums izstrādāt un pārvaldīt JavaScript lietojumprogrammas.

Nokārtojuši šīs dienas, kad jūs tikko lejupielādējāt JavaScript failu un pievienojāt to savai lapai. Tagad mēs izmantojam NPM vai Bower paketes vadītājus.

Mēs apvienojam un samazina skriptus, pārbaudiet tos, kas palīdz organizēt projekta struktūru.

JavaScript rīki iet roku rokā, izstrādājot izomorfisko JavaScript (kods, ko izmanto gan klienta pusē, gan serverī). Ecmascript 6, viņš ir ES6, viņš ir eSnext

Pārlūkprogrammas joprojām ir jāīsteno lielākā daļa ECMAScript funkcionālā 6. Bet šodien jūs varat izmantot jaunus priekšmetus no ES6, izmantojot JavaScript kompilatorus. Iepazīstieties ar jaunām API un metodēm: rindas, masīvi un citas metodes, piemēram, vājas, simboli un klases. Jums vienmēr jāapzinās gaidāmās izmaiņas.

Secinājums

Es varu jums pateikt daudz. Spriežot pēc šī raksta lieluma, jūs varat iedomāties, cik daudz jums ir jāzina JavaScript izstrādātājs. Mēs vienkārši pieskārās aisberga virsotnēm. Nedomāju, ka šis raksts būtu jāpārbauda kā ceļvedis attīstītājam. Tas ir tikai mana personīgā redzējums par problēmu.