Moderne JavaScript med ES6-ES13 (JS-veiledning)

Variabelldeklarasjon i JavaScript: let og const forklart

Alle videoer i opplæringen Moderne JavaScript med ES6-ES13 (JS-opplæring)

I denne veiledningen skal vi se nærmere på de ulike metodene for variabeldeklarasjon i JavaScript, spesielt på nøkkelordene let og const fra ES6-standarden sammenlignet med var, som frem til ES5 var den eneste måten å opprette variabler på. Mange utviklere har støtt på uventede oppførsler når de brukte var, som førte til feil. Denne leksjonen vil hjelpe deg med å forstå de moderne metodene og sørge for at du effektivt deklarerer og bruker variabler.

Viktigste funn

De nye variabeldeklarasjonene let og const gir fordeler når det gjelder scope, synlighet og sikkerhet ved bruk av variabler. let tillater bruken av en variabel innen et blokk-scope, mens const lager en uforanderlig tildeling.

Trinn-for-trinn-guide

Deklarasjon av variabler

For å jobbe effektivt med variabler i JavaScript, skal vi først undersøke deklarasjonen av variabler ved hjelp av var, let og const. La oss begynne med filen main.js, som er inkludert i ditt HTML-dokument.

Variabelldeklarasjon i JavaScript: let og const forklart

Her vil vi bruke nøkkelordet var for å deklarere en variabel. La oss lage en variabel med navnet W og tildele en startverdi.

Oppførsel av var

En typisk oppførsel av var er at variabelen er synlig selv om du først initialiserer den senere i koden. La oss teste dette:

Jeg vil lage en konsollutskrift av C før initialiseringen. Forvent resultatet når jeg setter variabelen C til 0. I utskriften skal undefined vises, siden verdien først settes etter linjen for tildeling.

Introduksjon til let

Nå ser vi på let. For å vise forskjellen, erstatt var med let og initialiser variabelen C med let C = 0.

Når jeg prøver å bruke C før tildelingen, får jeg en feilmelding om at jeg prøver å få tilgang til en ikke-initialisert variabel. Denne oppførselen gjør at du alltid får en feil hvis du prøver å få tilgang til en ikke-definert variabel.

Variabelldeklarasjon i JavaScript: let og const forklart

Blockscope med let

En annen fordel med let er muligheten til å deklarere en variabel innen et blokk-scope. La oss bruke en if-setning til dette:

Når jeg lager let C = -1 innen if-blokken, er denne variabelen kun synlig innenfor dette blokk-scope. Når jeg prøver å bruke C utenfor blokken, får jeg en feil.

Variabelldeklarasjon i JavaScript: let og const forklart

Bruk av const

Neste steg er å bruke const. Hvis jeg ville brukt const i stedet for let, ville jeg laget en konstant variabel som ikke kan endres.

Når jeg prøver å tildele C på nytt etter tildelingen const C = 0, får jeg beskjed om at jeg ikke kan tildele en ny verdi til en konstant variabel.

Uforanderlige objekter med const

Når vi bruker const for å deklarere et objekt, kan objektet i seg selv fortsatt endres, men ikke referansen. Jeg kan legge til elementer i objektet uten videre problemer.

Beste praksis for bruk av let og const

Basert på min erfaring anbefaler jeg å bruke const som standard, med mindre du er sikker på at verdien av variabelen må endres senere. Denne praksisen fører til mer lesbar og vedlikeholdbar kode.

Bruk let når det er nødvendig å endre verdien innen et blokk-scope. Et eksempel kan være en tellevariabel i en løkke.

Sammendrag – Variabeldeklarasjon i JavaScript: let og const versus var

Oppsummert har vi undersøkt forskjellene mellom var, let og const. let og const gir betydelige forbedringer når det gjelder scope samt sikkerheten til variabler. Mens var er global eller funksjonslokal, sørger let og const for synlighet innen et blokk-scope. Dessuten sikrer const uforanderlighet av tildelingen, noe som reduserer feil og uventet oppførsel i koden.

Vanlige spørsmål

Hvordan deklarerer jeg en variabel i JavaScript?Du kan deklarere en variabel i JavaScript med nøkkelordene var, let eller const.

Hva er forskjellen mellom let og var?let tillater deklarasjon av variabler som kun er synlige innen et blokk-scope, mens var er globalt synlig.

Når bør jeg bruke const?const bør brukes når du er sikker på at verdien av en variabel ikke skal endres under programkjøringen.

Hva skjer hvis jeg prøver å tildele en konstant på nytt?Du får en feil, da en const-variabel ikke kan endres.

Kan jeg endre objekter med const?Ja, du kan endre egenskapene til et objekt som er deklarert med const, men ikke referansen til objektet selv.