Basic JavaScript syntax

Als je ervaring hebt met een van de populaire programmeertalen zoals C++, Java, C# of PHP, dan herken je waarschijnlijk de JavaSript syntaxis. De reden hiervoor is dat al deze talen afstammen van, of sterk geïnspireerd zijn door, de programmeertaal C. Als je echter geen ervaring hebt met deze talen of zelfs maar met programmeren, zal ik je een snelle inleiding geven in de syntaxis van JavaScript.

Laten we beginnen met een basisregel, die verwarrend kan zijn als je helemaal nieuw bent in programmeren:

JavaScript is hoofdlettergevoelig

Dit betekent dat a niet hetzelfde is als A - ik zal u een voorbeeld laten zien:

var a = 42;
alert(A);

Hier declareer ik een variabele (daarover later meer) met de naam a (kleine letter), maar in de volgende regel probeer ik hem te gebruiken door te verwijzen naar A (hoofdletter). Dit gaat mis omdat ik niet dezelfde case gebruik.

Statements

Een statement is in feite een regel code:

alert("Hello, world!");

Merk op dat ik eindig met een puntkomma - dit informeert de interpreter dat het statement klaar is. Dit betekent ook dat, hoewel een statement meestal één regel code is, het fysiek niet op één regel hoeft te staan. Voel je vrij om meerdere regels te gebruiken, zolang je maar eindigt met een puntkomma:

var s = "Hello world and welcome to this very long
		piece of text, which uses multiple lines!";

Merk op dat terwijl sommige C-stijl programmeertalen erg strikt zijn over het vereisen van een puntkomma aan het einde, JavaScript dat in feite niet is - het zal proberen te raden of je verklaring eindigt wanneer een regeleinde wordt bereikt, en dit zal in veel gevallen werken. Hier is een voorbeeld:

var s = "Hello, world"
var n = 42

Soms begrijpt de interpreter echter niet wat je bedoelt, als de regel code complexer is, en dan moet je de puntkomma toch toevoegen. Om deze reden raden JavaScript richtlijnen over het algemeen aan om altijd de afsluitende puntkomma te gebruiken - op die manier vergeet je het niet als het er echt toe doet. Het stelt je ook in staat om later over te stappen naar een strengere programmeertaal zonder dat je nieuwe gewoontes hoeft aan te leren.

Blokken

Als je controlestructuren zoals IF statements en lussen gebruikt, moet je bepalen welke regel(s) code worden opgenomen. Standaard neemt JavaScript aan dat alleen de volgende regel deel uitmaakt van je controlestructuur. Voorbeeld:

var b = false;
if(b == true)
	alert("This will not happen...");

alert("This WILL happen!");

Als je het uitvoert, zul je zien dat alleen de tweede alert() wordt geactiveerd. De reden hiervoor is dat het if() statement nooit waar zal zijn (daar hebben we voor gezorgd), dus de volgende regel wordt nooit geraakt. Als je echter meer dan één regel code in het if-statement wilt opnemen, moet je een blok maken. We gebruiken accolades om de regels code in te kapselen die we willen laten beïnvloeden door deze specifieke if-instructie:

var b = false;
if(b == true)
{
	alert("This will not happen...");
	alert("This won't happen either...");	
}

alert("This WILL happen!");

Merk op dat ik in dit voorbeeld, net als in het voorbeeld hierboven, de volgende regel laat inspringen na het if statement (eerste voorbeeld) en ook binnen het blok (tweede voorbeeld). Dit is niet verplicht, maar de meeste programmeurs zullen het doen, omdat het de code leesbaarder maakt. Je kunt een regel, of zelfs meerdere regels, laten inspringen door de Tab-toets op je toetsenbord te gebruiken. En als je een blok binnen een blok hebt (enzovoort), moet je het op de juiste manier laten inspringen - één inspringing per blok, zoals dit:

let a = 1, b = 2, c = 3;
if(a == 1)
{
	if(b == 2)	
	{
		if(c == 3)	
			document.write("ok!");
	}
}

Blokken worden veel gebruikt in JavaScript, bijvoorbeeld voor controlestructuren zoals in het voorbeeld hierboven, maar ook bij het definiëren van functies. Daarover later meer.

Opmerkingen

Standaard wordt alles wat u in uw JavaScript-code schrijft, behalve spaties, geïnterpreteerd en moet daarom geldige JavaScript-code zijn. Soms moet u echter een opmerking achterlaten, voor uzelf of voor uw team. Gelukkig kun je dit met JavaScript heel gemakkelijk doen. Als de interpreter twee schuine strepen voorwaarts tegenkomt, wordt de rest van de regel genegeerd:

// This line is a comment

Je kunt dit ook doen op dezelfde regel als een statement, zolang je maar onthoudt dat na de twee forward slashes, de rest wordt genegeerd door de interpreter:

alert("Hello!"); // The rest of this line is a comment

Je kunt meerdere regels commentaar na elkaar hebben:

// This line is a comment
// ...so is this one

Maar als u veel regels met commentaar nodig hebt en u wilt niet elke regel voorafgaan met de twee schuine strepen, dan kunt u de meerregelige commentaarsyntaxis gebruiken. Het begint met een schuine streep naar voren, onmiddellijk gevolgd door een sterretje (*). Daarna wordt alles als commentaar beschouwd, totdat je uit de commentaarmodus springt door dezelfde notatie te gebruiken, maar dan omgekeerd (dus eerst een sterretje, dan een schuine streep naar voren). Hier is een voorbeeld:

/*
	All of these lines are comments 
	and you can write whatever you want,
	formatted however you want it!
*/

Schakel eenvoudig tussen deze twee soorten commentaren zoals u wilt.

Samenvatting

Dit was een snelle introductie in de syntax van JavaScript, die je hopelijk zal helpen bij het begrijpen van de voorbeelden in de rest van deze tutorial. Natuurlijk is er nog meer syntaxis te leren, maar daar zullen we gaandeweg dieper op ingaan, wanneer we de verschillende aspecten van de taal introduceren.