JavaScript Academy · Les

Optional chaining met de operator ?.

Krijg veilig toegang tot diep geneste eigenschappen.

Les 1 van 413 stappen

Optional chaining met de operator ?. is een gratis JavaScript Academy-les op CoddyKit. Dit is les 1 van 4. Je kunt 3 lessen uit dit leerpad gratis volledig lezen — daarna ontgrendelt CoddyKit PRO alle lessen, plus praktische oefeningen met een ingebouwde code-editor en een AI-tutor die 24/7 beschikbaar is. Deze les maakt deel uit van het leertraject JavaScript Academy. Je voortgang wordt gesynchroniseerd op het web en in de CoddyKit-app. De cursus JavaScript Academy bevat in totaal 4 lessen.

Het probleem

Als je een eigenschap leest van iets dat undefined of null is, ontstaat er een TypeError. Met optionele ketening kun je geneste waarden veilig lezen.

const user = {};
console.log(user.profile && user.profile.name);

De operator ?.

De operator voor optionele ketening ?. stopt en geeft undefined terug als de waarde links ervan null of undefined is, in plaats van een fout te veroorzaken.

const user = {};
console.log(user.profile?.name); // undefined, no error

Diepe eigenschappen lezen

Je kunt meerdere stappen met ?. aan elkaar ketenen om diep geneste structuren te doorlopen zonder op elk niveau handmatige controles te schrijven.

const data = { user: { address: { city: "Paris" } } };
console.log(data.user?.address?.city); // "Paris"

Voortijdig stoppen

Als een schakel in de keten nullish is, stopt de hele expressie voortijdig met undefined als resultaat en wordt de rest niet geëvalueerd.

const data = { user: null };
console.log(data.user?.address?.city); // undefined

Alleen nullish-waarden activeren dit

?. stopt alleen bij null of undefined. Andere waarden die als onwaar gelden, zoals 0 of "", zijn echte waarden en worden normaal benaderd.

const obj = { count: 0 };
console.log(obj.count?.toString()); // "0"

Vergelijking met &&

Voor ?. ketenden ontwikkelaars controles met && aan elkaar. Optionele ketening is korter en duidelijker voor dezelfde bedoeling.

const u = { profile: { name: "Ada" } };
const a = u && u.profile && u.profile.name;
const b = u?.profile?.name;
console.log(a, b);

Keten na een aanroep

Je kunt na een methodeaanroep verder ketenen en veilig eigenschappen van de teruggegeven waarde benaderen.

const config = { get: () => ({ port: 8080 }) };
console.log(config.get()?.port); // 8080

Voortijdig stoppen midden in de keten

Als een schakel in het midden nullish is, stopt de evaluatie direct, zelfs als latere schakels anders functies zouden aanroepen.

const obj = { a: null };
console.log(obj.a?.b.c.d); // undefined, never touches b/c/d

Niet voor toewijzingen

Optionele ketening is bedoeld om waarden te lezen. Je kunt niets toewijzen aan een optionele keten; dit is een syntaxfout aan de linkerkant van =.

const o = { x: 1 };
// o?.x = 5; // SyntaxError
o.x = 5;
console.log(o.x);

Combineren met arrays

Het werkt ook met toegang via vierkante haken, wat later uitgebreider wordt behandeld. Dezelfde veiligheid voor nullish-waarden blijft van toepassing.

const state = { items: ["a", "b"] };
console.log(state.items?.[0]); // "a"

Overmatig gebruik vermijden

Gebruik ?. alleen waar een waarde legitiem kan ontbreken. Overmatig gebruik kan fouten verbergen door ze stil te negeren, terwijl je ze juist wilt zien.

const order = { total: 42 };
console.log(order.total?.toFixed(2)); // "42.00"

Korte controle

Voorspel het resultaat.

Beantwoord dit in de interactieve les

Samenvatting

Met de operator ?. lees je eigenschappen veilig: als de linkerkant null of undefined is, geeft de operator undefined terug in plaats van een fout te veroorzaken en stopt hij de rest van de keten. Alleen nullish-waarden activeren dit, niet 0 of "", en je kunt de operator niet als doel voor een toewijzing gebruiken.

Gratis beginnen

Leer JavaScript met een AI-tutor — gratis

Schrijf echte code en voer die uit in je browser, krijg direct hulp van een AI-tutor die 24/7 beschikbaar is en ga verder waar je gebleven bent op het web of in de app.

Cursussen: 59
Lessen: 200

Gratis beginnen met leren Bekijk de volledige cursus

Veelgestelde vragen

Is de les “Optional chaining met de operator ?.” gratis?

Ja — je kunt hier op het web alle 3 lessen van het leerpad JavaScript Academy, waaronder “Optional chaining met de operator ?.”, gratis volledig lezen. Daarna ontgrendelt CoddyKit PRO alle lessen, plus interactieve oefeningen met een ingebouwde code-editor en een AI-tutor die 24/7 beschikbaar is. De cursus JavaScript Academy bevat in totaal 4 lessen.

Wat leer ik in “Optional chaining met de operator ?.”?

Krijg veilig toegang tot diep geneste eigenschappen. Je oefent met JavaScript Academy door code rechtstreeks in de browser uit te voeren. Een AI-begeleider die 24/7 beschikbaar is beantwoordt je vragen terwijl je de les doorwerkt.

Heb ik ervaring nodig om met JavaScript Academy te beginnen?

Ervaring vooraf is niet nodig. JavaScript Academy op CoddyKit is opgebouwd voor beginners tot gevorderden, zodat je hier of bij het begin kunt starten en in je eigen tempo kunt leren. Dit is les 1 van 4.

Hoe lang duurt de les “Optional chaining met de operator ?.”?

De meeste lessen van CoddyKit duren ongeveer 5–10 minuten. Elke les is kort en interactief, zodat je gestaag vooruitgaat en op het web en in de app precies verdergaat waar je was gebleven.

Kan ik code schrijven en uitvoeren in deze les over JavaScript Academy?

Ja. Elke les over JavaScript Academy bevat een ingebouwde code-editor, zodat je rechtstreeks in je browser echte code kunt schrijven en uitvoeren en direct feedback van AI krijgt — lokale installatie is niet nodig.

Alle lessen in deze cursus

← Terug naar JavaScript Academy