We werpen een eerste blik op de syntaxis van JavaScript, ofwel: hoe ‘schrijft’ u JavaScript en welke regels horen daarbij? Vanzelfsprekend ga ik daar in mijn boek Handboek JavaScript & jQuery, 4e editie. veel dieper op in!

De taal JavaScript heeft een eenvoudige syntaxis . Er zijn veel dingen toegestaan. JavaScript is bij lange na niet zo streng als C# of Java. Het toevoegen van een enkele regel JavaScript aan een HTML-pagina zorgt er al voor dat het script werkt als een apart programma. Speciale voorbereidingen behalve de tag <script>…</script> zijn niet nodig.

Deze paragraaf behandelt de elementen waaruit een JavaScript-programma is opgebouwd of opgebouwd kan zijn. Heel eenvoudige programma’s gebruiken niet alle elementen, terwijl complexe JavaScript-applicaties op alle structuurelementen een beroep zullen doen.

Aan de orde komen achtereenvolgens:

• statements
• variabelen
• gegevenstypen
• voorbeelden

Statements

Zoals u in hoofdstuk 1 hebt gezien, is het volgende codefragment een volkomen geldig JavaScript-programma:

<script>
document.getElementById(‘divResult’).innerHTML = ‘Hello World’
</script>

Dit script bestaat uit één JavaScript-statement. Statements kunt u beschouwen als de opdrachten aan de JavaScript-runtime. In een webomgeving is dat de browser zoals we hebben gezien.

In dit voorbeeld selecteert het statement het element divResult in het document. Vervolgens wordt de tekst Hello world toegekend aan de eigenschap innerHTML. Er is een groot aantal statements beschikbaar voor verschillende taken binnen een programma. Een statement kan bijvoorbeeld waarden toewijzen aan een variabele, elementen in een pagina selecteren en vervolgens manipuleren of de programma-uitvoer verleggen door een functie aan te roepen.

Structuur van statements

• Elk statement wordt afgesloten met een puntkomma.
• Statements mag u – net als HTML-code – voor de leesbaarheid verdelen over meerdere regels.
• JavaScript negeert eventuele regelovergangen en inspringing.
• Plaats dus pas een puntkomma aan het eind van een statement en niet aan het eind van elke regel.

💡Gebruik altijd een puntkomma
De puntkomma ter afsluiting van een regel kennen we ook in PHP, C en Java. JavaScript is evenwel minder kieskeurig dan deze talen. U mag de puntkomma weglaten zonder dat JavaScript daarover klaagt. Maar voor de duidelijkheid is het wel aan te bevelen de puntkomma toch te gebruiken. Anders gaat JavaScript zélf de puntkomma invoegen op plaatsen waar het denkt dat u dit bedoelt (dit heet automatic semicolon insertion, een van de hoofdpijnpunten van JavaScript als u er niet bekend mee bent). Dat kan tot lastig op te sporen fouten leiden. Plaats daarom altijd een puntkomma als een statement is afgelopen.

Hoofdletters en kleine letters

• JavaScript is hoofdlettergevoelig, oftewel case sensitive.
• Dit geldt voor de gereserveerde woorden van JavaScript (de keywords) en voor eigen functies en variabelen. Als u een variabele declareert, moet u die verderop in het programma met exact dezelfde naam benaderen. Anders maakt JavaScript ter plekke een nieuwe variabele, met die (foutieve) naam. Dat is natuurlijk niet de bedoeling en kan tot buitengewoon moeilijk te traceren fouten in het script leiden.

• Ook functienamen moeten overal in het script op dezelfde wijze worden gespeld. Anders ziet u een fout als xxx is not defined. In de debugger verschijnt dan een klein rood kruis met daarin een getal. Het getal geeft het aantal fouten aan dat tijdens de uitvoering in het script is opgetreden. De afbeelding hierboven  geeft daarvan een voorbeeld. De functie is gedeclareerd als function toonVersie(), maar in de aanroep is ToonVersie() (met hoofdletter T) gebruikt. Dat gaat niet goed. U moet dan de code verbeteren.

Peter Kassenaar heeft nog véél meer boeken op z’n conto staan; vanzelfsprekend vindt u daaruit ook tal van stukken op dit blog!

Met het Handboek JavaScript en jQuery leert u snel programmeren in JavaScript, de scripttaal die op het web een belangrijke rol speelt. U hebt het nodig als u meer wilt dan alleen statische websites opmaken met HTML en CSS. De auteur gaat uitgebreid in op taalconstructies, opdrachten en de vele mogelijkheden die deze flexibele programmeertaal biedt. In het tweede deel van het boek wordt het nog steeds erg populaire jQuery besproken.

Deze aanvullende JavaScript-bibliotheek tilt de kracht van JavaScript naar een hoger niveau en strijkt tevens de verschillen tussen de diverse browsers glad. Aan het einde van elk hoofdstuk vindt u praktijkoefeningen en daarnaast is alle voorbeeldcode gratis beschikbaar op internet. Dit Handboek is de ultieme inleiding in de kracht van programmeren in JavaScript en jQuery.

• 
  JavaScript leren met Peter Kassenaar
• 
  De boeken van Peter Kassenaar in de Web Development Library
• 
  Joost de Valk van Yoast SEO: ‘SEO is gewoon veel werk!’
• 
  Chantal Schinkels: ‘We moeten focussen op cultuurverandering…’
• 
  Live schrijven aan Programmeren voor niet-programmeurs…
• 
  Een grote update voor Flutter: Flutter 2.0
• 
  Het boxmodel van CSS
• 
  Hoe begin je met SEO?
• 
  Maak een schakelaar met CSS en HTML

Peter Kassenaar

Peter Kassenaar is auteur van vele boeken over algemeen pc-gebruik, programmeertalen en internettechnieken. Hij is gespecialiseerd in frond-endtools, -frameworks en -toepassingen. Via zijn eigen bedrijf verzorgt hij trainingen op deze gebieden voor bedrijven en organisaties. De boeken van Peter vind je hier.