JavaScript Academy · leksjon

Valgfrie kall og indeksaksess

Bruk optional chaining med kall og hakeparenteser.

Leksjon 4 av 413 trinn

Valgfrie kall og indeksaksess er en gratis leksjon i JavaScript Academy på CoddyKit. Dette er leksjon 4 av 4. Du kan lese valgfritt 3 leksjoner fra denne læringsstien gratis i sin helhet – deretter låser CoddyKit PRO opp alle leksjoner, samt praktisk øving med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Den er en del av læringsløpet i JavaScript Academy, og fremdriften din synkroniseres mellom nettet og CoddyKit-appen. Kurset i JavaScript Academy inneholder totalt 4 leksjoner.

Mer enn egenskapslesing

Optional chaining har også former for å kalle funksjoner og lese elementer fra arrayer eller med dynamiske nøkler på en trygg måte.

const obj = { greet: () => "hi" };
console.log(obj.greet?.()); // "hi"

Valgfrie metodekall

Formen ?.() kaller en funksjon bare hvis den finnes. Hvis metoden er nullish, returneres undefined i stedet for at det oppstår en feil.

const obj = {};
console.log(obj.greet?.()); // undefined, no error

Hvorfor dette er viktig

Uten dette fører et kall til en manglende metode til en feil. Formen for valgfrie kall beskytter ryddig mot valgfrie callback-funksjoner.

function run(onDone) {
  onDone?.(); // safe whether or not onDone is provided
}
run();
run(() => console.log("done"));

Bare nullish-verdier hopper over kallet

?.() hopper bare over kallet når verdien er null eller undefined. Hvis verdien er noe annet enn en funksjon, oppstår det fortsatt en TypeError når De kaller den.

const obj = { greet: 42 };
try {
  obj.greet?.();
} catch (e) {
  console.log("not a function");
}

Valgfri indeks-tilgang

Formen ?.[ ] leser et element bare hvis basen ikke er nullish. Dette er nyttig for arrayer og beregnede nøkler.

const arr = ["a", "b"];
console.log(arr?.[1]); // "b"
const none = null;
console.log(none?.[0]); // undefined

Dynamiske nøkler

Hakeparentesnotasjon med ?. håndterer dynamiske egenskapsnavn på en trygg måte.

const data = { user: { name: "Mia" } };
const key = "name";
console.log(data.user?.[key]); // "Mia"

Nestede arrayer

De kan kjede valgfri indeks-tilgang gjennom nestede arrayer eller objekter.

const grid = [[1, 2], [3, 4]];
console.log(grid?.[1]?.[0]); // 3
console.log(grid?.[5]?.[0]); // undefined

Valgfritt kall på returnert verdi

De kan kombinere formene: Les en verdi valgfritt, og kall den deretter valgfritt.

const handlers = { click: () => "clicked" };
console.log(handlers.click?.()); // "clicked"
console.log(handlers.hover?.()); // undefined

Kombinere med standardverdier

Kombiner disse formene med ?? for å gi resultatet en reserveverdi.

const config = {};
const port = config.get?.() ?? 3000;
console.log(port); // 3000

Kalle array-metoder trygt

Optional chaining lar Dem kalle en metode på en array som kanskje mangler, uten en separat kontroll av om den finnes.

const state = { tags: null };
console.log(state.tags?.join(", ") ?? "none"); // "none"

Bruk dette når valgfrihet er reell

Disse formene er spesielt nyttige for valgfrie callback-funksjoner og datastrukturer som kan variere. Unngå dem der en verdi alltid skal finnes, slik at reelle feil fortsatt blir oppdaget.

const events = { onSave: null };
events.onSave?.("payload"); // silently does nothing
console.log("continued");

Hurtigsjekk

Velg den trygge formen for funksjonskall.

Besvar den i den interaktive leksjonen

Oppsummering

Optional chaining omfatter ?.() for trygge metodekall og ?.[ ] for trygg indeks- eller tilgang med dynamisk nøkkel. Begge returnerer undefined når basen er nullish, men det oppstår fortsatt en feil hvis en verdi som ikke er en funksjon, kalles. Kombiner dem med ?? for standardverdier, og bruk dem på verdier som faktisk er valgfrie.

Gratis å komme i gang

Lær deg JavaScript med en AI-veileder – gratis

Skriv og kjør ekte kode i nettleseren, få umiddelbar hjelp fra en AI-veileder som er tilgjengelig døgnet rundt, og fortsett der du slapp – på nettet eller i appen.

Kurs: 59
Leksjoner: 200

Start læringen gratis Se hele kurset

Ofte stilte spørsmål

Er leksjonen «Valgfrie kall og indeksaksess» gratis?

Ja – du kan lese valgfritt 3 av leksjonene i læringsstien JavaScript Academy, inkludert «Valgfrie kall og indeksaksess», gratis i sin helhet her på nettet. Deretter låser CoddyKit PRO opp alle leksjoner, samt interaktiv øving med en innebygd kodeeditor og en AI-veileder som er tilgjengelig døgnet rundt. Kurset i JavaScript Academy inneholder totalt 4 leksjoner.

Hva lærer jeg i «Valgfrie kall og indeksaksess»?

Bruk optional chaining med kall og hakeparenteser. Du øver på JavaScript Academy med praktisk kode som du kjører direkte i nettleseren, mens en AI-veileder som er tilgjengelig døgnet rundt, svarer på spørsmålene dine mens du jobber deg gjennom leksjonen.

Trenger jeg erfaring for å begynne med JavaScript Academy?

Ingen tidligere erfaring er nødvendig. JavaScript Academy på CoddyKit er lagt opp for både nybegynnere og viderekomne, så De kan begynne her eller helt fra start og lære i Deres eget tempo. Dette er leksjon 4 av 4.

Hvor lang tid tar leksjonen «Valgfrie kall og indeksaksess»?

De fleste CoddyKit-leksjoner tar omtrent 5–10 minutter. Hver leksjon er kort og interaktiv, slik at De gjør jevne fremskritt og kan fortsette akkurat der De slapp – både på nettet og i appen.

Kan jeg skrive og kjøre kode i denne JavaScript Academy-leksjonen?

Ja. Alle JavaScript Academy-leksjoner har en innebygd kodeeditor, slik at De kan skrive og kjøre ekte kode direkte i nettleseren og få umiddelbar tilbakemelding fra AI – uten lokal konfigurering.

Alle leksjonene i dette kurset

← Tilbake til JavaScript Academy