Je wilt altijd uitgebreide kennis opdoen in het vakgebied waarmee je werkt. JavaScript is een van de talen waarover het bijna onmogelijk is om uitgebreide kennis op te doen. Het evolueert voortdurend, net als het web in het algemeen, dus elke webontwikkelaar moet ernaar streven deze ontwikkeling bij te houden, en nog meer moet hij de basisprincipes van de technologie die hij gebruikt uit zijn hoofd kennen.

JavaScript domineert nu de IT-wereld. Hiermee kun je een kleine webapplicatie maken of een robot programmeren. Gelukkig bestaat de taal al geruime tijd, en ontwikkelaars die deze uitstekend onder de knie hebben, hebben hun ervaringen met het programmeren daarin in boeken beschreven.

In dit boek leest u hoe u computers kunt laten doen wat u wilt dat ze doen. Computers zijn tegenwoordig net zo gewoon als schroevendraaiers, maar bevatten veel meer verborgen complexiteiten en zijn daarom moeilijker te begrijpen en te bedienen. Voor velen blijven het vreemde, enigszins bedreigende dingen. Het boek is ook verkrijgbaar in het Russisch.

Dit boek biedt een grondig overzicht van de wereld van JavaScript via ingebouwde objecten en de nuances van de taal. Dit boek is zeker niet bedoeld voor mensen die net beginnen met programmeren in het algemeen en JavaScript in het bijzonder.

Dit boek behandelt zowel klassieke als moderne JavaScript-programmeerpatronen. Over het algemeen is het bedoeld voor beginnende programmeurs.

HTML5 biedt geweldige mogelijkheden. Dat geldt ook voor jQuery. Net als Node.JS. Als je er wat puurder JavaScript aan toevoegt, kun je gemakkelijk het internet veroveren.

Dit boek is bedoeld voor degenen die van plan zijn webapplicaties te maken met JS. Het beschrijft de kenmerken van de taal, handige tools, sjablonen, en de lijst is hier niet toe beperkt.

Dit boek geeft u algemene kennis van JavaScript, waarbij u zowel de algemene logica als de details ervan begrijpt. De auteur gaat ervan uit dat de lezer al bekend is met de principes van objectgeoriënteerd programmeren en een taal als PHP, Ruby, Python, C++ of Java.

Bent u klaar om uw webprogrammering een stap verder te brengen en over te stappen van coderen in HTML en CSS naar het maken van volwaardige dynamische pagina's? Dan is het tijd om kennis te maken met de "heetste" programmeertaal: JavaScript!

Na het lezen van dit boek leer je alles over de taal JavaScript: van variabelen tot loops. Je begrijpt waarom verschillende browsers anders reageren op code en hoe je universele code schrijft die door alle browsers wordt ondersteund. Je begrijpt waarom JS de toekomst is en wordt een echte front-end developer.

Dit boek laat zien hoe je front-end-applicaties in JS schrijft zonder gebruik te maken van frameworks of bibliotheken van derden.

Naast algemene kennis van JavaScript-principes geeft dit boek je ook kennis van aanverwante gebieden, zoals JSON of NoSQL, en inzicht in hoe webapplicaties in het algemeen worden geschreven.

Zoals de titel doet vermoeden, gaat dit boek over het ontwikkelen van applicaties met één pagina. Het beschrijft geen specifieke technologieën en raamwerken, maar het beschrijft wel algemene patronen en praktijken goed.

Het boek is gewijd aan het werken met het DOM (Document Object Model) - misschien wel het belangrijkste in JavaScript voor alle webontwikkelaars.

Dit boek, geschreven door Douglas Crockford, de maker van JSON en JSLint, is een klassieker in de JavaScript-wereld die iedereen zou moeten lezen. Het behandelt de basisprincipes van de objectgeoriënteerde benadering en biedt veel voorbeelden, zowel goede als slechte. Natuurlijk vertelt de auteur hoe dergelijke ‘schadelijke’ voorbeelden kunnen worden gecorrigeerd en hoe dergelijke fouten kunnen worden vermeden.

Deze serie, geschreven door de bekende leraar Kyle Simpson, bestaat uit 6 boeken, die elk een ander deel van de taal behandelen. Het belangrijkste voordeel van deze boeken is dat ze zo kort zijn dat je geen tijd hebt om afgeleid te worden. En u kunt het boek “ES6 and Beyond” uit deze serie kopen in een papieren versie in het Russisch.

JavaScript is het belangrijkste hulpmiddel van webontwikkelaars waarmee u internetpagina's interactief en dynamisch kunt maken en de hoogste prestaties kunt behalen. Dit is een goed gestructureerde handleiding voor JavaScript waarmee u deze niet de gemakkelijkst te leren, maar zeer populaire taal snel kunt leren. In het boek wordt veel aandacht besteed aan de jQuery-bibliotheek. Er zijn ook veel voorbeelden en gedetailleerde taken.

Na het lezen van de Uitgebreide Gids kunt u:

• Maak uw websitepagina's interactief.
• Beheers de nieuwste versie van de jQuery UI-plug-in.
• Maak handige formulieren met automatische gegevensvalidatie en -correctie.
• Gebruik AJAX-technologie.
• Verdiep je kennis in het vakgebied en word een professional.

Nadat u de basisprincipes van de lay-out heeft geleerd, wilt u zeker meer interactiviteit en schoonheid, evenals gemakkelijkere manieren waarop de site met de backend kan communiceren. Dat is het moment waarop JavaScript de arena betrad, samen met het waanzinnig populaire jQuery-framework. Om met het boek aan de slag te gaan, heb je geen diepgaande kennis nodig; je haalt er alles uit. Alleen de nieuwste praktijken op het gebied van cross-browser compatibiliteit en pagina-optimalisatie worden hier gedemonstreerd en de presentatie is in duidelijke taal met duidelijke voorbeelden en illustraties.

Een boek dat nu al een klassieker is geworden. De nieuwste editie behandelt HTML5 en ECMAScript 6 - de meest relevante technologieën van dit moment. Het voegt ook nieuwe hoofdstukken toe over jQuery en JavaScript op de server. Deze gids is nuttig voor zowel complete beginners als voor degenen die hun kennis van JavaScript tot in de perfectie willen aanscherpen.

Aangepaste vertaling van het artikel “Full-Stack JavaScript in Six Weeks: A Curriculum Guide”

Webontwikkeling is een van de eenvoudigste en daarom populaire gebieden onder beginnende programmeurs. Elke teksteditor en browser is voldoende om te werken; het is niet nodig om algoritmen op een geavanceerd niveau te bestuderen, het resultaat van elke fase van het schrijven van een programma is duidelijk - over het algemeen zijn er veel voordelen. Een belangrijke vaardigheid in de context van webontwikkeling is kennis van JavaScript.

Tegenwoordig ontwikkelt JavaScript zich zeer snel, en daarom kun je gemakkelijk in de war raken bij het leren van de taal. Wij bieden u een goed gestructureerd curriculum dat alle essentiële aspecten van JavaScript en aanverwante technologieën omvat.

Waarom JavaScript?

Het is de moeite waard om de openheid van de taal op te merken: bedrijven die gewoonlijk met elkaar concurreren, werken samen om JavaScript te ontwikkelen. De taal is zeer flexibel en zal geschikt zijn voor aanhangers van zowel objectgeoriënteerde als functionele benaderingen. Een groot aantal bibliotheken en frameworks maken het gemakkelijk om elk type probleem op te lossen, en het Node.js-serverplatform maakt het mogelijk om de taal niet alleen in de browser, maar ook in de console te gebruiken. Je kunt zelfs desktop- en mobiele applicaties schrijven: de eerste met behulp van het Electron-framework, en de laatste met NativeScript of React Native.

Basisprincipes

Eerst moet je de basisconcepten van JavaScript, webontwikkeling en programmeren in het algemeen leren:

• objectgeoriënteerde JS - constructeurs en fabrieken, overerving;
• functionele JS - functies van hogere orde, sluitingen, recursie;
• Jasmijntestspecificaties;
• basisprincipes van HTML, CSS en jQuery.

Git

Git is een essentieel hulpmiddel voor ontwikkelaars, dus ga er zo vroeg mogelijk mee aan de slag. Dit zijn de basisvaardigheden die je zou moeten hebben:

• bestanden in mappen maken en verplaatsen;
• initialisatie en commits in Git;
• repository's opzetten in GitHub.

Algoritmen en datastructuren

Vervolgens is het de moeite waard om meer te leren over algoritmen (in het bijzonder het concept van algoritmische complexiteit), maar ook over fundamentele datastructuren: gekoppelde lijsten, wachtrijen, stapels, binaire zoekbomen en hashtabellen. Dit zal je helpen.

BackendNode.js

10 jaar geleden kon JavaScript alleen worden gebruikt voor front-end ontwikkeling. Dankzij Node.js is de zaak nu niet beperkt tot één “front”. Node is eenvoudigweg een omgeving voor het uitvoeren van JS-code aan de serverzijde, dus u hoeft geen nieuwe syntaxis te leren, maar u moet wel bestanden importeren en exporteren, code modulariseren en de npm-pakketbeheerder gebruiken.

Servers, HTTP, Express.js

Nadat je Node hebt geleerd, is het de moeite waard om je kennis met backend-ontwikkeling en het begrijpen van servers en routing voort te zetten. U kunt beginnen met poorten en protocollen met de nadruk op HTTP, en vervolgens doorgaan naar Express, een knooppuntbibliotheek voor het verwerken van verzoeken.

Asynchrone JavaScript-databases, schema's, modellen en ORM's

Databases zijn een van de belangrijkste elementen van webontwikkeling. Als uw toepassing gegevens moet laden of opslaan die niet verloren gaan wanneer de pagina wordt vernieuwd, moet u een database gebruiken. Je moet leren onderscheid te maken tussen relationele en niet-relationele databases en de soorten relaties begrijpen. Leer dan verschillende mensen kennen. De mogelijkheid om met ORM te werken is ook niet overbodig.

FrontendHTML en CSS

HTML en CSS vormen de basis van elke webontwikkelaar. Je hoeft ze niet perfect te kennen, maar je moet ze wel begrijpen. Je kunt ook een populaire bibliotheek (bijvoorbeeld Bootstrap) en een CSS-preprocessor zoals Sass verkennen - dit zal ervoor zorgen dat CSS op gewone code lijkt. Om het werken met HTML te vereenvoudigen, kunt u een van de populaire sjabloonengines kiezen, bijvoorbeeld pug.

jQuery en DOM-manipulatie

Nadat u het uiterlijk van uw pagina met HTML en CSS heeft gecreëerd, gebruikt u ook jQuery om de DOM te manipuleren. Veel mensen denken dat jQuery nutteloos is en binnenkort vervangen zal worden door Angular en React, maar het is waanzinnig populair en daarom de moeite waard om te weten. Bovendien zul je op een dag in een situatie terechtkomen waarin het lastig voor je zal zijn om spijkers te slaan met een React-microscoop, en dan zal lichtgewicht jQuery je te hulp komen.

Chrome-ontwikkelaarstools

Het zou onvergeeflijk zijn om Chrome-tools, die een groot aantal mogelijkheden bieden, te verwaarlozen. Hiermee kun je DOM-elementen onderzoeken, fouten opsporen via de console, routes traceren en nog veel meer. We beschrijven verschillende handige functies van de Chrome-console die routinetaken eenvoudiger maken.

AJAX

Als je wilt dat je applicatie pagina's niet opnieuw laadt na elke databasebewerking, heb je zeker AJAX nodig - het verzendt asynchrone HTTP-verzoeken op de achtergrond, waarvan de antwoorden slechts een deel van de weergave bijwerken. U kunt met AJAX werken via jQuery met behulp van de .ajax-methode.

Geavanceerde onderwerpenTestgestuurde ontwikkeling

Of TDD is een ontwikkelingstechniek waarbij het maken van software wordt opgedeeld in vele kleine cycli: eerst worden er tests geschreven die de gewenste verandering dekken, en vervolgens wordt er code geschreven die deze tests doorstaat. Hierna wordt de code opnieuw bewerkt en worden indien nodig nieuwe tests geschreven. Als een codegedeelte bij sommige tests mislukt, wordt dit gecorrigeerd.

Webaansluitingen

Dit onderwerp verdient speciale aandacht, omdat het erg nuttig is. Het WebSocket-protocol maakt, in tegenstelling tot HTTP, een bidirectionele gegevensstroom mogelijk, wat deze technologie uniek maakt. De meest gebruikelijke implementatie is de socket.io-bibliotheek. Als u deze begrijpt en de verworven vaardigheden in de praktijk toepast, kunt u een browsergame voor meerdere spelers maken.

ES6, Babel, Webpack

Momenteel is de belangrijkste standaard ES6 (ES2015), maar ES2016 is al aangenomen en ES2017 is in ontwikkeling, dus u moet altijd op de hoogte zijn van updates en deze gebruiken. Compatibiliteitsproblemen kunnen met slechts een paar hulpmiddelen worden opgelost:

• Babel - compileert ES6-code (ES2016-ondersteuning binnenkort beschikbaar) naar ES5, die door alle browsers wordt ondersteund. Het weet zelfs hoe het JSX/React-componenten moet compileren, wat het onmisbaar maakt voor elke webontwikkelaar;
• Webpack - verzamelt al uw bronbestanden (afbeeldingen, lettertypen, stylesheets, JS-bestanden, enz.) in één enkele afhankelijkheidsgrafiek. Het zal niet nuttig zijn bij het maken van kleine applicaties, maar bij het werken met React is de hulp van onschatbare waarde.

Reageren en Redux

React is een bibliotheek voor het maken van gebruikersinterfaces. Het werd in 2013 door Facebook gemaakt en werd al snel populair onder ontwikkelaars. U moet lezen en vervolgens demonteren om te begrijpen hoe React werkt en wat het doet. React is niet alleen nuttig voor front-end-ontwikkeling: Facebook heeft versies van het raamwerk uitgebracht voor mobiele (React Native) en VR-ontwikkeling (React VR).

Redux is een voorspelbare statuscontainer die vaak wordt gebruikt in combinatie met React. Het kan worden gebruikt om code in te korten vanwege de modulariteit ervan. Vooral handig in realtime toepassingen voor meerdere gebruikers, zoals games.

Authenticatie, sessies, cookies

U moet ook begrijpen hoe applicaties omgaan met gebruikers, het inloggen en uitloggen van accounts verwerken en rechten verlenen. Om de identiteit van de gebruiker tijdens een sessie te achterhalen, worden cookies gebruikt: kleine tekstbestanden die door de server naar de browser worden verzonden als reactie op een HTTP-verzoek. En om de verbinding tussen de database en autorisatiepagina's te garanderen, kunt u de express-session-bibliotheek gebruiken.

Webbeveiliging

En tot slot moet u op de veiligheid letten. Het is belangrijk om zowel aanvalsmethoden als manieren om je ertegen te verdedigen te leren.

• Vertaling

Het materiaal, waarvan we de vertaling vandaag publiceren, is gewijd aan de basisprincipes van JavaScript en is bedoeld voor beginnende programmeurs. Het kan ook worden beschouwd als een klein naslagwerk over fundamentele JS-constructies. Hier zullen we het in het bijzonder hebben over het datatypesysteem, variabelen, arrays, functies, objectprototypes en enkele andere kenmerken van de taal.

Primitieve gegevenstypen JavaScript kent de volgende primitieve gegevenstypen: getal, boolean, string, ongedefinieerd, null. Er moet meteen worden opgemerkt dat we bij het werken met primitieve gegevenstypen, bijvoorbeeld letterlijke tekenreeksen, toegang hebben tot hun methoden en eigenschappen, zelfs zonder een expliciete conversie uit te voeren. Het punt hier is dat bij pogingen om dergelijke bewerkingen uit te voeren, letterlijke getallen automatisch worden uitgerust met de juiste objectwrapper.▍Getallen Er bestaat slechts één type getal in JavaScript: drijvende-kommagetallen met dubbele precisie. Dit leidt ertoe dat de resultaten van het berekenen van sommige uitdrukkingen rekenkundig onjuist zijn. Je weet misschien al dat in JS de waarde van de uitdrukking 0,1 + 0,2 niet gelijk is aan 0,3. Tegelijkertijd worden dergelijke problemen niet waargenomen bij het werken met gehele getallen, dat wil zeggen 1 + 2 === 3.

JavaScript heeft een Number-object, een objectverpakking voor numerieke waarden. Objecten van het type Number kunnen worden gemaakt met behulp van een commando als var a = new Number(10) , of u kunt vertrouwen op het automatische gedrag van het hierboven beschreven systeem. Hierdoor kunnen methoden die zijn opgeslagen in Number.prototype specifiek worden aangeroepen wanneer ze worden toegepast op numerieke letterlijke waarden:

(123).toString(); //"123" (1.23).toFixed(1); //"1.2"
Er zijn globale functies die zijn ontworpen om waarden van andere typen naar een numeriek type te converteren. Dit zijn parseInt() , parseFloat() en de Number()-constructie, die in dit geval fungeert als een reguliere functie die typeconversie uitvoert:

ParseInt("1") //1 parseInt("text") //NaN parseFloat("1.234") //1.234 Getal("1") //1 Getal("1.234") //1.234
Als een bewerking met getallen resulteert in iets dat geen getal is (tijdens een berekening of wanneer je iets in een getal probeert om te zetten), zal JavaScript geen fout genereren, maar het resultaat van een dergelijke bewerking weergeven als een NaN-waarde ( Geen nummer, geen nummer). Om te controleren of een waarde NaN is, kunt u de functie isNaN() gebruiken.

Rekenkundige bewerkingen in JS werken op een zeer vertrouwde manier, maar u moet er op letten dat de operator + zowel het optellen van getallen als het aaneenschakelen van tekenreeksen kan uitvoeren.

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

▍Strings Strings in JavaScript zijn reeksen Unicode-tekens. Letterlijke tekenreeksen worden gemaakt door de tekst tussen dubbele aanhalingstekens ("") of enkele aanhalingstekens ("") te plaatsen. Zoals eerder vermeld, kunnen we bij het werken met letterlijke tekenreeksen vertrouwen op de overeenkomstige objectwrapper, waarvan het prototype veel nuttige methoden heeft, waaronder substring(), indexOf(), concat().

"text".substring(1,3) //ex "text".indexOf("x") //2 "text".concat(" end") //text end
Strings zijn, net als andere primitieve waarden, onveranderlijk. De methode concat() wijzigt bijvoorbeeld geen bestaande tekenreeks, maar maakt een nieuwe.

▍Booleaanse waarden Het Booleaanse gegevenstype in JS wordt weergegeven door twee waarden: waar en onwaar. De taal kan verschillende waarden automatisch omzetten naar een Booleaans datatype. Dus naast de logische waarde false zijn de volgende waarden null , undefined , "" (lege string), 0 en NaN . Al het andere, inclusief alle objecten, zijn echte waarden. Tijdens Booleaanse bewerkingen wordt alles wat als true wordt beschouwd, geconverteerd naar true en alles wat als false wordt beschouwd, wordt omgezet in false. Kijk eens naar het volgende voorbeeld. In overeenstemming met de bovenstaande principes wordt de lege string omgezet in false en als gevolg van het uitvoeren van deze code verschijnt de regel This is false in de console.

Laat tekst = ""; if(tekst) ( console.log("Dit is waar"); ) else ( console.log("Dit is niet waar"); )

Objecten Objecten zijn dynamische structuren die bestaan ​​uit sleutel-waardeparen. Waarden kunnen primitieve gegevenstypen, objecten of functies zijn.

Objecten kunnen het gemakkelijkst worden gemaakt met behulp van de letterlijke objectsyntaxis:

Laat obj = ( bericht: "Een bericht", doSomething: function() () )
Objecteigenschappen kunnen op elk moment worden gelezen, toegevoegd, bewerkt en verwijderd. Zo werkt het:

• Eigenschappen lezen: object.naam, object .
• Gegevens naar eigenschappen schrijven (als de eigenschap waartoe toegang wordt verkregen niet bestaat, wordt een nieuwe eigenschap met de opgegeven sleutel toegevoegd): object.name = waarde, object = waarde.
• Eigenschappen verwijderen: verwijder object.name , verwijder object .

Hier zijn enkele voorbeelden:

Laat obj = (); // een leeg object maken obj.message = "Een bericht"; // een nieuwe eigenschap toevoegen obj.message = "Een nieuw bericht"; // de eigenschap bewerken delete object.message; // een eigenschap verwijderen
Objecten in de taal worden geïmplementeerd als hashtabellen. Een eenvoudige hashtabel kan worden gemaakt met de opdracht Object.create(null):

Laat frans = Object.create(null); frans["ja"] = "oui"; frans["nee"] = "niet"; frans["ja"];//"oui"
Als u een object onveranderlijk wilt maken, kunt u de opdracht Object.freeze() gebruiken.

Om alle eigenschappen van een object te doorlopen, kunt u de opdracht Object.keys() gebruiken:

Functie logProperty(naam)( console.log(naam); //eigenschapsnaam console.log(obj); //eigenschapswaarde ) Object.keys(obj).forEach(logProperty);

▍Vergelijking van waarden van primitieve typen en objecten Wanneer je praktisch met primitieve waarden werkt, kun je ze, zoals al gezegd, waarnemen als objecten die eigenschappen en methoden hebben, ook al zijn het geen objecten. Primitieve waarden zijn onveranderlijk en de interne structuur van objecten kan veranderen. Variabelen In JavaScript kunnen variabelen worden gedeclareerd met behulp van de trefwoorden var, let en const.

Wanneer u het trefwoord var gebruikt, kunt u een variabele declareren en, indien nodig, initialiseren met een bepaalde waarde. Als een variabele niet is geïnitialiseerd, is de waarde ervan ongedefinieerd. Variabelen die zijn gedeclareerd met het trefwoord var hebben een functionele reikwijdte.

Het let-trefwoord lijkt sterk op var , met het verschil dat variabelen die met het let-trefwoord zijn gedeclareerd, een blokbereik hebben.

Variabelen die zijn gedeclareerd met het trefwoord const hebben ook een blokbereik, dat, gezien het feit dat de waarden van dergelijke variabelen niet kunnen worden gewijzigd, correcter ‘constanten’ zou worden genoemd. Het const sleutelwoord, dat de waarde bevriest van een variabele die ermee wordt gedeclareerd, kan worden vergeleken met de Object.freeze() methode, die objecten bevriest.

Als een variabele buiten een functie wordt gedeclareerd, is de reikwijdte ervan globaal.

Arrays Arrays in JavaScript worden geïmplementeerd met behulp van objecten. Als gevolg hiervan hebben we het, als we het over arrays hebben, eigenlijk over array-achtige objecten. U kunt met array-elementen werken met behulp van hun indexen. Numerieke indices worden geconverteerd naar tekenreeksen en gebruikt als namen om toegang te krijgen tot array-elementwaarden. Een constructie als arr is bijvoorbeeld vergelijkbaar met een constructie als arr["1"] , en beide geven toegang tot dezelfde waarde: arr === arr["1"] . Op basis van het bovenstaande wordt een eenvoudige array gedeclareerd met let arr = ["A", "B", "C"] weergegeven als een object, ongeveer als volgt:

("0": "A", "1": "B", "2": "C")
Als u elementen uit een array verwijdert met behulp van de opdracht delete, blijven er gaten in achter. Om dit probleem te voorkomen, kun je het commando splice() gebruiken, maar dat is langzaam omdat het, na het verwijderen van een element, de overige elementen van de array verplaatst, sterker nog, naar het begin van de array, naar links.

Laat arr = ["A", "B", "C"]; verwijder arr; console.log(arr); // ["A", leeg, "C"] console.log(arr.length); // 3
Arraymethoden maken het eenvoudig om datastructuren zoals stapels en wachtrijen te implementeren:

// stapel laat stapel =; stapel.push(1); // stapel.push(2); // laat als laatste = stack.pop(); // console.log(laatste); // 2 // wachtrij laat wachtrij = ; wachtrij.push(1); // wachtrij.push(2); // eerst laten = wachtrij.shift();// console.log(eerst); // 1

Functies Functies in JavaScript zijn objecten. Functies kunnen aan variabelen worden toegewezen, opgeslagen in objecten of arrays, als argumenten aan andere functies worden doorgegeven en vanuit andere functies worden geretourneerd.

Er zijn drie manieren om functies te declareren:

• Klassieke functiedeclaratie (Function Declaration of Function Statement).
• Functie-expressies gebruiken, ook wel functieliterals genoemd.
• Syntaxis van de pijlfunctie gebruiken.

▍Klassieke functiedeclaratie Bij deze benadering van functiedeclaratie zijn de volgende regels van toepassing:

• Het eerste trefwoord op de functiedeclaratieregel is function .
• De functie moet een naam krijgen.
• Een functie kan in code worden gebruikt voordat deze wordt gedeclareerd, vanwege het mechanisme waarmee de functiedeclaratie naar de top van het bereik wordt gebracht waarin deze wordt gedeclareerd.

Zo ziet een klassieke functiedeclaratie eruit:

Functie doSomething()()

▍Functie-expressies Houd bij het gebruik van functie-expressies rekening met het volgende:

• Het functiesleutelwoord is niet langer het eerste woord op de functiedeclaratieregel.
• Een functienaam is optioneel. Het is mogelijk om zowel anonieme als benoemde functie-expressies te gebruiken.
• De opdrachten voor het aanroepen van dergelijke functies moeten de opdrachten volgen voor het declareren ervan.
• Een dergelijke functie kan onmiddellijk na de declaratie ervan worden gestart, met behulp van de IIFE-syntaxis (Immediately Invoked Function Expression).

De functie-expressie ziet er als volgt uit:

Laat iets doen = function()()

▍Pijlfuncties Pijlfuncties kunnen in wezen worden beschouwd als “syntactische suiker” voor het maken van anonieme functie-uitdrukkingen. Opgemerkt moet worden dat dergelijke functies geen eigen entiteiten hebben. Een pijlfunctiedeclaratie ziet er als volgt uit:

Laat iets doen = () = > ();

▍Manieren om functies aan te roepen Functies kunnen op verschillende manieren worden aangeroepen. Normale functieaanroep doSomething(argumenten) Een functie aanroepen als een methode van theObject.doSomething(argumenten) theObject["doSomething"](argumenten) Een functie aanroepen als een constructor new doSomething (argumenten) Een functie aanroepen met de methode apply() doSomething.apply(theObject, ) doSomething.call(theObject, argumenten) Een functie aanroepen met de methode bind() let doSomethingWithObject = doSomething.bind(theObject); doSomethingWithObject();
Functies kunnen worden aangeroepen met meer of minder argumenten dan het aantal parameters dat is opgegeven toen ze werden gedeclareerd. Tijdens de werking van de functie worden “extra” argumenten eenvoudigweg genegeerd (hoewel de functie er wel toegang toe heeft), ontbrekende parameters krijgen de waarde undefined .

Functies hebben twee pseudoparameters: this en argumenten.

▍Het trefwoord this Het trefwoord this vertegenwoordigt de context van een functie. De waarde waarnaar het verwijst, hangt af van hoe de functie is aangeroepen. Hier zijn de waarden die dit trefwoord aanneemt, afhankelijk van hoe de functie wordt aangeroepen (ze, met codevoorbeelden, waarvan de constructies hier worden gebruikt, worden hierboven beschreven):

• Een normale functieaanroep is window /undefinieerd.
• Een functie aanroepen als een methode van een object - theObject .
• Het aanroepen van een functie als constructor is een nieuw object.
• Een functie aanroepen met de methode apply() - theObject .
• Een functie aanroepen met behulp van de methode bind() - theObject .

▍Het trefwoord arguments Het trefwoord arguments is een pseudoparameter die toegang geeft tot alle argumenten die in de functieaanroep worden gebruikt. Het lijkt op een array, maar het is geen array. Het heeft met name geen arraymethoden.

Functie reduceToSum(totaal, waarde)( retourneert totaal + waarde; ) functie sum())( laat args = Array.prototype.slice.call(argumenten); return args.reduce(reduceToSum, 0); ) sum(1,2 , 3);
Een alternatief voor het trefwoord argumenten is een nieuwe syntaxis voor de overige parameters. In het volgende voorbeeld is args een array die alles bevat dat aan de functie is doorgegeven toen deze werd aangeroepen.

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

▍Return-instructie Een functie die geen return-instructie bevat, retourneert ongedefinieerd. Wanneer u het return-trefwoord gebruikt, let dan op hoe het automatische puntkomma-invoegmechanisme werkt. De volgende functie retourneert bijvoorbeeld geen leeg object, maar een ongedefinieerde waarde:

Functie getObject() ( return ( ) ) getObject()
Om dit probleem te voorkomen, plaatst u de openingsaccolade op dezelfde regel als de return-instructie:

Functie getObject() ( return ( ) )

Dynamisch typen JavaScript is een dynamisch getypeerde taal. Dit betekent dat concrete waarden typen hebben, maar variabelen niet. Tijdens de uitvoering van het programma kunnen waarden van verschillende typen naar dezelfde variabele worden geschreven. Hier is een voorbeeld van een functie die werkt met waarden van verschillende typen:

Functie log(waarde)( console.log(waarde); ) log(1); log("tekst"); log((bericht: "tekst"));
Om erachter te komen welk type gegevens in een variabele zijn opgeslagen, kunt u de operator typeof() gebruiken:

Laat n = 1; type(n); // nummer let s = "tekst"; soort(en); //string laat fn = functie() (); type(fn); //functie

Single-threaded uitvoeringsmodel De JavaScript-runtime is single-threaded. Dit komt met name tot uiting in de onmogelijkheid van gelijktijdige uitvoering van twee functies (als je geen rekening houdt met de mogelijkheid van asynchrone code-uitvoering, die we hier niet bespreken). De runtime-omgeving heeft iets dat een gebeurteniswachtrij wordt genoemd en waarin een lijst met taken wordt opgeslagen die moeten worden verwerkt. Als gevolg hiervan heeft het single-threaded JS-uitvoeringsschema niet het probleem van impasses in de bronnen, dus is er geen behoefte aan een vergrendelingsmechanisme. Code die de gebeurteniswachtrij binnenkomt, moet echter snel worden uitgevoerd. Als u de hoofdthread in een browserapplicatie overbelast met zwaar werk, reageert de applicatiepagina niet op gebruikersinvoer en zal de browser u vragen deze pagina te sluiten. JavaScript beschikt over een mechanisme voor het afhandelen van uitzonderingen. Het werkt volgens een principe dat vrij gebruikelijk is voor dergelijke mechanismen: code die een fout kan veroorzaken, wordt geformatteerd met behulp van de try/catch-constructie. De code zelf bevindt zich in het try-blok, fouten worden afgehandeld in het catch-blok.

Het is interessant om op te merken dat JavaScript soms, wanneer zich een noodsituatie voordoet, geen foutmeldingen produceert. Dit komt door het feit dat JS geen fouten veroorzaakte tot de adoptie van de ECMAScript 3-standaard.

In het volgende codefragment mislukt bijvoorbeeld een poging om een ​​bevroren object te wijzigen, maar wordt er geen uitzondering gegenereerd.

Laat obj = Object.freeze(); obj.message = "tekst";
Sommige van de "stille" JS-fouten verschijnen in de strikte modus. U kunt dit inschakelen met behulp van de "use strict" -constructie; .

Het prototypesysteem Het prototypesysteem ligt ten grondslag aan JS-mechanismen zoals constructorfuncties, de opdracht Object.create() en het trefwoord class.
Beschouw het volgende voorbeeld:

Laat service = (doSomething: function() () ) laat specialistischeService = Object.create(service); console.log(gespecialiseerdeService.__proto__ === service); //WAAR
Hier werd de opdracht Object.create() gebruikt om een ​​gespecialiseerdService-object te maken waarvan het prototype een serviceobject moest zijn. Als gevolg hiervan blijkt dat de methode doSomething() kan worden aangeroepen door toegang te krijgen tot een gespecialiseerdService-object. Bovendien betekent dit dat de eigenschap __proto__ van het gespecialiseerdeService-object naar het service-object verwijst.

Laten we nu een soortgelijk object maken met behulp van het trefwoord class:

Class Service ( doSomething() ) klasse SpecializedService breidt Service uit ( ) laat specializedService = new SpecializedService(); console.log(specializedService.__proto__ === SpecializedService.prototype);
Methoden die in de Service-klasse zijn gedeclareerd, worden toegevoegd aan het Service.prototype-object. Instanties van de klasse Service hebben hetzelfde prototype (Service.prototype). Alle instanties delegeren methodeaanroepen naar het Service.prototype-object. Als gevolg hiervan blijkt dat methoden slechts één keer worden gedeclareerd, in Service.prototype , waarna ze worden “geërfd” door alle instanties van de klasse.

▍Prototypeketen Objecten kunnen “erfgenamen” zijn van andere objecten. Elk object heeft een prototype waarvan de methoden beschikbaar zijn. Als u probeert toegang te krijgen tot een eigenschap die zich niet in het object zelf bevindt, gaat JavaScript ernaar zoeken in de prototypeketen. Dit proces gaat door totdat de eigenschap is gevonden, of totdat de zoekopdracht het einde van de keten bereikt. Over Functioneel Programmeren in JavaScript In JavaScript zijn functies eersteklas objecten; de taal ondersteunt een sluitingsmechanisme. Dit opent de weg naar het implementeren van functionele programmeertechnieken in JS. We hebben het in het bijzonder over de mogelijkheid om functies van hogere orde te gebruiken.

Een afsluiting is een interne functie die toegang heeft tot variabelen die binnen de bovenliggende functie zijn gedeclareerd, zelfs nadat de bovenliggende functie is uitgevoerd.

Een functie van hogere orde is een functie die andere functies als argumenten kan nemen, functies kan retourneren of beide kan doen.

Functioneel programmeren in JS komt in veel publicaties aan bod. Als je geïnteresseerd bent, zijn hier enkele materialen over dit onderwerp gewijd

JavaScript speelt een rol wanneer we bepaalde acties moeten uitvoeren aan de clientzijde die toegang heeft gekregen tot onze webpagina.

JavaScript kan een webpagina wijzigen zonder contact te maken met de server, de waarden van gebruikersinvoer valideren en andere bewerkingen uitvoeren.

Dit artikel biedt basisinformatie om u op weg te helpen met het gebruik van JavaScript.

Een script rechtstreeks in de paginacode invoegen

U kunt JS-code rechtstreeks op de pagina invoegen.

alert("Hallo daar!"); //wat JS-code hier

Verplaats de code naar een apart bestand

U kunt de JavaScript-code in een extern bestand plaatsen en een link ernaartoe op de pagina gebruiken

In dit geval is de sluittag vereist.

Het is het beste om scripts vóór de afsluitende tag in te voegen

Variabelen Namen van variabelen

Namen van variabelen kunnen beginnen met een hoofdletter, een kleine letter, een onderstrepingsteken of een $-teken.

De naam kan cijfers bevatten, maar de naam van de variabele mag niet met een cijfer beginnen.

JavaScript is hoofdlettergevoelig: mijntekst en mijnText zijn twee verschillende variabelen.

Het is beter om CamelCase te gebruiken voor de naamgeving, waarbij u elk woord in de variabelenaam met een hoofdletter begint.

Variabelen declareren

Javascript gebruikt var om variabelen te declareren.

Var mijnTekst; //undefined myText = "Hallo!";

alert(mijnTekst);

Onmiddellijk na het declareren van een variabele is de waarde ervan ongedefinieerd.

U kunt een waarde aan een variabele toewijzen wanneer u deze declareert:

Var mijnText = "Hallo!";

Het is ook mogelijk om meerdere variabelen in één var te declareren:

Var som = 4 + 5, myText = "Hallo!";

Bij het toekennen van een waarde kan var worden weggelaten, maar het is beter om dit niet te doen.

Variabele typen

In JavaScript kun je de volgende strings gebruiken:

Var mijnText = "Hallo!";

gehele getallen:

Var mijnNummer = 10;

Fractionele getallen:

var pi = 3,14;

Booleaanse waarden:

Var isBoolean = onwaar;

JavaScript-syntaxisdetails Opmerkingen

Opmerkingen op dezelfde regel worden gemarkeerd met “//”. Alles na deze tekens wordt als commentaar beschouwd.

Als u meerdere regels wilt becommentariëren, gebruikt u "/*" om het begin van het commentaar aan te geven en "*/" om het einde van het commentaar aan te geven.

/* hier is commentaarcode en het is ook commentaar */

Scheiding van de operator

Om operatoren te scheiden moet u ";" gebruiken

Het is raadzaam, maar niet verplicht, om witruimte te gebruiken om de leesbaarheid van tekst te verbeteren.

Werken met tekenreeksen var str = 4 + 5 + "7"

geeft de stringwaarde "97" in str

Varstr2 = "7" + 4 + 5

Feit is dat de waarde van de toevoeging opeenvolgend wordt berekend - van links naar rechts. Wanneer er 2 getallen worden opgeteld, is het resultaat een getal. Wanneer een string en een getal worden toegevoegd, wordt het getal gezien als een string en worden de twee strings gecombineerd.

Een string omzetten in een getal

Om een ​​string naar een getal te converteren, gebruik je parseInt() en parseFloat()

Deze functies krijgen twee argumenten. De eerste is de string die zal worden omgezet in een getal en de tweede is de getalsysteembasis die zal worden gebruikt voor de vertaling. Om een ​​string als een decimaal getal te behandelen, moet je 10 als tweede argument gebruiken

Var mijnNummer = parseInt("345", 10);

JavaScript-functies

Functies in JavaScript worden als volgt gedeclareerd:

Functie myFunction() (Sommige JS-code)

Om een ​​waarde terug te geven, moet je return gebruiken:

Functie mijnVermenigvuldiging(paramEén, paramTwee) ( return paramEén * paramTwee )

U kunt een "anonieme" functie declareren door de naam van de functie weg te laten.

Een functie kan als parameter aan een andere functie worden doorgegeven door de naam ervan op te geven.

Objecten

Alles in JavaScript is een afstammeling van Object.

Een nieuw object maken var person = new Object(); // een persoonsobject maken person.firstname = "Andrew"; // voeg het eerste attribuut toe person.lastname = "Peterson";// voeg het tweede attribuut toe person.getFullName = function() (// voeg de methode return this.firstname + " " + this.lastname toe; )

Ten tweede, kortere optie voor het maken van een object

Var person = ( // een persoonsobject maken voornaam: "Andrew", achternaam: "Peterson", getFullName: function() ( retourneer this.firstname + " " + this.lastname; ) )

Werken met objecteigenschappen

var mij = nieuw object();

ik["naam"] = "Serg";
ik.leeftijd = 33;

Arrays in JavaScript Een array maken var arr = new Array(11, "Hallo!", true); // Maak een array

Nieuwe manier van opnemen

Var arr = ; // Maak een array

Werken met arrays in JavaScript Aantal elementen in de array var length = arr.length; // 3 Elementen aan de array toevoegen - push arr.push("Een nieuwe waarde"); Het laatste element van een array ophalen - pop var lastValue = arr.pop(); Arrays combineren var arr2 = ; var longArray = arr.concat(arr2); // Combineren van twee arrays arr en arr2 in één longArray Join - samenvoegen van alle elementen van de array var longString = arr.join(tray) // "11:Hello!:true" Vergelijking en logische functies in JavaScript Min of meer var isWaar = 6 >= 5; // groter dan of gelijk aan Gelijkheid var isFalse = 1 == 2; // gelijk aan isTrue = 1 != 2; // niet gelijk var ookTrue = "6" == 6; Identiteit var notIdentical = "3" === 3 // false omdat de gegevenstypen niet overeenkomen notIdentical = "3" !== 3 // true omdat de gegevenstypen niet overeenkomen IF-instructie if (5< 6) { alert("true!"); } else { alert("false!") } Оператор SWITCH var lunch = prompt("What do you want for lunch?","Type your lunch choice here"); switch(lunch){ case "sandwich": console.log("Sure thing! One sandwich, coming up."); break; case "soup": console.log("Got it! Tomato"s my favorite."); break; case "salad": console.log("Sounds good! How about a caesar salad?"); break; case "pie": console.log("Pie"s not a meal!"); break; default: console.log("Huh! I"m not sure what " + lunch + " is. How does a sandwich sound?"); } Логическое AND — && if (1 == 1 && 2 == 2) { alert("true!"); } Логическое OR — || if (1 == 1 || 2 == 3) { alert("true!"); } Логическое NOT — ! if (!(1 == 1)) { alert("false!"); } Циклы FOR for (var i = 0; i < 10; i = i + 1) { alert(i); } var names = [ "Sergey", "Andrey", "Petr" ]; for (var i = 0, len = names.length; i < len; i = i + 1) { alert(names[i]); } WHILE while (true) { // Бесконечный цикл alert("This will never stop!"); } var names = [ "Sergey", "Andrey", "Petr" ]; while (names.length >0) ( alert(names[i]); ) DO WHILE do ( alert("Dit zal nooit stoppen!"); ) while (true) ( ​​// Oneindige lus Regels tekst = "Blah blah blah blah blah blah Eric \ bla bla bla Eric bla bla Eric bla bla \ bla bla bla bla bla Eric"; Substrings

Soms wilt u de geheel string, slechts een deel ervan. In uw Gmail-inbox kunt u bijvoorbeeld instellen dat de eerste vijftig tekens van elk bericht worden weergegeven, zodat u er een voorbeeld van kunt bekijken. Dit voorbeeld is een subtekenreeks van de originele string (het hele bericht).

"een woord".substring(x, y) waarbij x het punt is waar je begint met hakken en y het punt is waar je eindigt met het hakken van de originele string.

Het nummergedeelte is een beetje vreemd. Om de “hij” in “hallo” te selecteren, schrijft u dit: “hallo”. subtekenreeks(0, 2);

Stel je voor dat er links van elk teken een markering staat, zoals deze: 0-h-1-e-2-l-3-l-4-o-5 .

Als je op 0 hakt en opnieuw op 2, hou je alleen hij over.

Meer voorbeelden:

1. Eerste 3 letters van "Batman"
"Batman".substring(0,3)

2. Van de 4e tot de 6e letter van “laptop”
"laptop".substring(3,6)

Het is beter om de basisprincipes van programmeren te leren met een taal waarmee je gemakkelijk een baan kunt vinden. Elk jaar publiceert de TIOBE-index een ranglijst van de meest populaire technologieën, evenals de dynamiek van de opkomst en ondergang van hun populariteit.

Op basis van deze gegevens kunt u de positie van Javascript volgen en de juiste conclusies trekken: hoewel de taal niet de meest populaire is, ontwikkelt deze zich gestaag. Omdat het aantal vacatures voor de functie van frontend developer gestaag groeit, en het aantal gebieden waar Javascript gebruikt wordt steeds groter wordt, raden wij aan om daarmee te beginnen.

Als u nog steeds niet zeker weet of u Javascript helemaal opnieuw kunt leren, dan brengen wij een artikel onder uw aandacht dat zowel in woord als in voorbeeld het tegendeel zal bewijzen.

Javascript: vanaf nul leren

Laten we u eerst vertellen wat Javascript is en waarom het nodig is.

Javascript is een op prototypen gebaseerde technologie die wordt gebruikt om scripts te schrijven die door speciale software worden uitgevoerd.

Wanneer het in menselijke taal wordt vertaald, is het een hulpschakel in de keten van software-script-uitvoering.

Waarom is Javascript nodig? Waar wordt deze programmeertaal gebruikt? Als u besluit mobiele, desktop- en platformonafhankelijke applicaties, games, client- en serveronderdelen van webapplicaties te ontwikkelen, dan bent u welkom om Javascript te gebruiken. Dit is werkelijk een multifunctionele technologie die geschikt is voor de ontwikkeling van velen, zo niet alles.

Trouwens! Voor onze lezers geldt er nu 10% korting op

Javascript-basisbeginselen voor beginners: waar te leren

Hoe JavaScript helemaal opnieuw leren? Hoe leer je zelfstandig programmeren? Veel beginnende programmeurs stellen deze vragen. Gelukkig bestaat het antwoord, en het is behoorlijk gedetailleerd.

Er zijn verschillende mogelijkheden om deze programmeertaal te leren:

• gespecialiseerde cursussen,
• onafhankelijke studie,
• studeren aan de universiteit.

Bij gespecialiseerde cursussen is alles duidelijk: kom en leer. Docenten in dergelijke cursussen zijn praktiserende ontwikkelaars die niet alleen theoretische punten delen, maar ook versterken met de praktijk.

Cursussen moeten langdurig zijn. Niemand kan je iets leren in een maand!

Zelf Javascript helemaal opnieuw leren: 4 manieren

Als je JavaScript zelf wilt leren, zul je extreem zelfdiscipline moeten hebben en je uiterste best moeten doen om ervoor te zorgen dat alles lukt. Zoals ze zeggen: geduld en werk zullen alles vermalen.

Voordat u gaat programmeren in Javascript, moet u uw voorbereidingsplan goed doordenken. Wij bieden onze versie aan, en u kunt deze aanpassen afhankelijk van uw doelen, mogelijkheden en capaciteiten.

1. Leer eenvoudige dingen leren en onthouden. Het vermogen tot zelfontwikkeling moet worden ontwikkeld. Het is erg belangrijk om vruchtbaar te kunnen studeren. Het vereist zelfdiscipline en een sterk doel, dus leer jezelf voordat je begint met leren hoe je moet leren.

2. Leer de basisprincipes van JavaScript. Codecademy: Leer JavaScript, SnoopCode: JavaScript-tutorials, MDN's JavaScript-gids - deze online bronnen behandelen grammatica, typen, loops, functies, uitdrukkingen, getallen, datums, opmaak en meer.

3. Begin met het verkennen van geavanceerde taalfuncties. Nadat je de basis hebt geleerd, kun je beginnen met het beheersen van bibliotheken en frameworks: JQuery, ReactJS, Angular 2, node.js, wat ontwikkeling aan de serverkant en anderen mogelijk maakt.

4. Creëer uw eigen projecten. Free Code Camp is een community van ontwikkelaars waar je code kunt posten, projecten kunt maken en er certificaten voor kunt ontvangen. En het belangrijkste is om feedback te ontvangen van andere communityleden.

Professionele ontwikkeling: oefenen en nog eens oefenen

Je kunt heel veel literatuur bestuderen, maar zonder constante oefening zul je niets bereiken.

Iemand kan geen meester in zijn vak worden genoemd als hij alles weet, maar niets kan doen.

Programmeren vereist, net als elk ander bedrijf, constante oefening. Beter nog: leer en oefen tegelijkertijd. Zo toets je de theorie meteen in de praktijk en begrijp je waar je fouten maakt. En er zullen fouten zijn, geloof me. Maar wees er niet bang voor. Integendeel, zonder fouten zal er geen vooruitgang zijn.

Plan je dag zo dat je elke dag twee uur studietijd hebt. Werk niet te hard. Neem pauzes en verander uw activiteit. Ideaal om Javascript te leren.

Bekijk videolessen, lees en bewaar interessante artikelen, woon seminars en conferenties bij, bespreek en deel uw mening met andere studenten.

Over het algemeen heb je veel werk, maar het kan zijn dat je niet genoeg tijd hebt als je ook aan de universiteit studeert. We raden je daarom aan contact op te nemen met de studentenservice om je leven gemakkelijker te maken en je doel te bereiken.