Nullish Coalescing Operatøren i JavaScript

Denne artikkelen forklarer Nullish Coalescing Operatøren i JavaScript.

YouTube Video

Nullish Coalescing Operatøren i JavaScript

I JavaScript evaluerer Nullish Coalescing Operatøren (??) om en verdi er null eller undefined og returnerer en annen standardverdi i så fall. Det ligner på den ofte brukte logiske ELLER-operatøren (||), men skiller seg ut ved at den spesialiserer seg på null og undefined.

Den logiske OR-operatøren returnerer høyre verdi hvis venstre verdi er falsy, mens den nullaktige sammenslåingsoperatøren kun returnerer høyre verdi når venstre verdi er null eller undefined. Denne funksjonen tillater korrekt håndtering av verdier som 0 og tomme strenger ("").

Grunnleggende Syntax

1let result = value ?? defaultValue;

• value er verdien som blir sjekket.
• defaultValue er verdien som returneres når value er null eller undefined.

Eksempler på bruk av Nullish Coalescing Operatøren

Det følgende eksemplet implementerer en prosess for å returnere en standardverdi i tilfelle null eller undefined.

1let name = null;
2let defaultName = "Anonymous";
3
4// If name is null or undefined, 'Anonymous' is returned
5let displayName = name ?? defaultName;
6console.log(displayName); // "Anonymous"

I denne koden, siden name er null, returneres verdien av defaultName, "Anonymous". Hvis name er en verdi annet enn null eller undefined, returneres den verdien.

Forskjeller med den logiske ELLER-operatøren

Den nullaktige sammenslåingsoperatøren ligner på den logiske OR-operatøren, men har en viktig forskjell. Den logiske OR-operatøren sjekker for 'falske' verdier (false, 0, NaN, "", null, undefined, osv.), mens den nullaktige sammenslåingsoperatøren sjekker kun etter null og undefined.

Eksempel på logisk ELLER-operatør:

1let count = 0;
2let defaultCount = 10;
3
4// Since count is falsy (0), defaultCount is returned
5let result = count || defaultCount;
6console.log(result); // 10

Eksempel på Nullish Coalescing Operatør:

1let count = 0;
2let defaultCount = 10;
3
4// Since count is neither null nor undefined, count is returned as is
5let result = count ?? defaultCount;
6console.log(result); // 0

På denne måten beholder den nullaktige sammenslåingsoperatøren gyldige verdier som 0 og tomme strenger ("") og returnerer en standardverdi kun når det er nødvendig. Siden den logiske OR-operatøren behandler disse verdiene som falsy og returnerer standardverdien, er det viktig å velge riktig operatør avhengig av brukstilfellet.

Eksempel på bruk i kombinasjon:

Den nullaktige sammenslåingsoperatøren kan også kombineres med andre logiske operatører, men forsiktighet er nødvendig når du gjør dette.

1let a = null;
2let b = 0;
3let c = false;
4
5// SyntaxError
6let result = a ?? b || c;

• For eksempel, når den brukes sammen med den logiske OR-operatøren (||) eller den logiske OG-operatøren (&&), bør parenteser brukes for å tydeliggjøre rekkefølgen på operasjonene.

1let a = null;
2let b = 0;
3let c = false;
4
5let result = (a ?? b) || c;
6console.log(result); // false

• I dette eksemplet evalueres a ?? b først, og siden a er null, returneres b. Deretter evalueres b || c, og siden b er falsk, returneres til slutt c.

Tilfeller hvor den nullaktige sammenslåingsoperatøren er nyttig

Følgende er tilfeller hvor den nullaktige sammenslåingsoperatøren er nyttig.

• Standardverdier for skjemaer Dette kan brukes i situasjoner hvor en standardverdi er satt for skjemainndatafelt når brukeren ikke fyller inn noe.

1let userAge = null;
2let defaultAge = 18;
3let age = userAge ?? defaultAge;
4console.log(age); // 18

• Håndtering av API-svar Fallback-behandling kan utføres når verdien er null eller undefined i svar fra API-et.

1let apiResponse = {
2    title: "New Article",
3    description: null
4};
5
6let title = apiResponse.title ?? "Untitled";
7let description = apiResponse.description ?? "No description available";
8console.log(title);        // "New Article"
9console.log(description);  // "No description available"

Sammendrag

Den nullaktige sammenslåingsoperatøren (??) er svært nyttig for å initialisere data og håndtere API-responser, da den returnerer en standardverdi når den støter på null eller undefined. Spesielt er det et bedre valg enn den tradisjonelle logiske OR-operatøren (||) når du vil håndtere falsy verdier som 0 eller tomme strenger på riktig måte.

Om den nullaktige sammenkoblings-tilordningsoperatoren (??=)

Oversikt

I JavaScript har den nullaktige sammenkoblings-tilordningsoperatoren ??= blitt introdusert for effektivt å tilordne en ny verdi til variabler som har null eller undefined. Denne operatoren er en praktisk snarvei for å tilordne en verdi til en variabel bare hvis en bestemt verdi er null eller undefined.

Grunnleggende bruk

Den nullaktige sammenslåingstildelingsoperatøren fungerer som følger:.

• Hvis en variabel er null eller undefined, tilordner den verdien på høyre side.
• Hvis variabelen verken er null eller undefined, gjør den ingenting og beholder den nåværende verdien.

Syntaks

Den grunnleggende syntaksen for nullaktig sammenslåingstildelingsoperatør er som følger:.

1x ??= y;

• y blir tilordnet til x hvis x er null eller undefined.
• Hvis x allerede har en verdi (ikke null eller undefined), vil verdien til x ikke bli endret.

Eksempel

La oss se på et grunnleggende eksempel på den null-koaliserende tilordningsoperatoren.

1let userName = null;
2let defaultName = "Guest";
3
4// Since userName is null, defaultName is assigned
5userName ??= defaultName;
6
7console.log(userName);  // "Guest"

• I denne koden, siden userName er null, blir verdien til defaultName tilordnet.

Her er et eksempel der verdien verken er null eller undefined.

1let userName = "Alice";
2let defaultName = "Guest";
3
4// Since userName is "Alice", nothing is assigned
5userName ??= defaultName;
6
7console.log(userName);  // "Alice"

• I dette tilfellet, siden "Alice" allerede er satt for userName, blir det ingen tilordning.

Sammenligning med andre tilordningsoperatorer

JavaScript har også flere andre tilordningsoperatorer. Spesielt er forskjellen med den logiske ELLER-tilordningsoperatoren (||=) viktig.

1let value = 0;
2value ||= 10;  // Assign 10 if value is falsy
3console.log(value);  // 10

Den logiske OR-tildelingsoperatøren tildeler en verdi selv når falsy verdier som false, 0 eller en tom streng ("") oppstår, mens den nullaktige sammenslåingstildelingsoperatøren bare opererer når verdien er null eller undefined.

1let value = 0;
2value ??= 10;
3// Since value is neither null nor undefined,
4// nothing is assigned
5console.log(value);  // 0

Siden den nullaktige sammenslåingstildelingsoperatøren kun opererer på null eller undefined, er den svært nyttig når du vil beholde verdier som 0 eller false.

Virkelige brukstilfeller

Et praktisk bruksområde for operatoren for nullsammenkobling kan være som følger:.

1. Sette standardverdier

   Det er nyttig for å sette standardverdier når brukerinput eller API-responser kan være null eller undefined.

1let userSettings = {
2    theme: null,
3    notifications: true
4};
5
6// Since theme is null, "light" is assigned
7userSettings.theme ??= "light";
8
9console.log(userSettings.theme);  // "light"

2. Håndtering av valgfrie parametere

   Det kan også brukes til å utføre standardhandlinger når funksjonsargumenter ikke er spesifisert.

1function greet(name) {
2    name ??= "Guest";
3    console.log(`Hello, ${name}!`);
4}
5
6greet();  // "Hello, Guest!"
7greet("Alice");  // "Hello, Alice!"

Sammendrag

Den nullaktige sammenslåingstildelingsoperatøren (??=) tildeler kun en verdi når venstre verdi er null eller undefined, noe som gjør koden mer kortfattet og bidrar til å forhindre utilsiktede tildelinger. Spesielt når man arbeider med "falsy" verdier som 0 eller false, kan den være mer passende enn den tradisjonelle logiske OR-operatøren (||=).

Ved å bruke denne operatoren kan du lage mer robust og lesbar kode.

Du kan følge med på artikkelen ovenfor ved å bruke Visual Studio Code på vår YouTube-kanal. Vennligst sjekk ut YouTube-kanalen.

YouTube Video