Suprasti skirtumą tarp! ir ? „TypeScript“ operatoriai

„TypeScript“ operatorių, skirtų saugiai prieigai ir tvirtinimui, tyrinėjimas

Dirbant su TypeScript, kūrėjai dažnai susiduria su scenarijais, kai jiems reikia pasiekti objekto ypatybes arba metodus, kurie gali būti neapibrėžtas arba nulinis. Tokiose situacijose, ! (šauktukas) ir ? (klaustukas) įsijungia operatoriai. Šie operatoriai leidžia kūrėjams valdyti, kaip „TypeScript“ gali elgtis nulinis arba neapibrėžtas vertybes.

The ! operatorius, paprastai žinomas kaip „non-null asertion operator“, naudojamas norint pasakyti „TypeScript“ kompiliatoriui, kad pasiekiamas kintamasis arba išraiška nėra nulinis arba neapibrėžtas. Kita vertus, ?. operatorius arba „pasirenkamas grandinės operatorius“ saugiai patikrina, ar objektas egzistuoja, prieš bandydamas pasiekti jo savybes arba metodus.

Šis subtilus skirtumas yra labai svarbus kuriant programas ten, kur vykdymo klaidos Prieiga prie neapibrėžtų verčių gali sukelti didelių problemų. Šie du operatoriai padeda pagerinti kodo saugumą ir skaitomumą, tačiau jie naudojami skirtingiems tikslams.

Suprasti pagrindinius skirtumus tarp obj!.turtas ir obj?.turtas gali padėti kūrėjams parašyti daugiau tvirtas TypeScript kodas, išvengiant įprastų spąstų, kylančių dirbant su galimai neapibrėžtais duomenimis. Šiame straipsnyje mes pasinersime į šias sąvokas pateikdami pavyzdžius, iliustruojančius jų naudojimą.

Nenulinio tvirtinimo ir pasirenkamos grandinės supratimas naudojant „TypeScript“.

Pirmajame scenarijų rinkinyje nagrinėjamos dvi svarbios „TypeScript“ funkcijos: ne niekinis tvirtinimas operatorius (!) ir pasirenkamas grandinės sujungimas operatorius (?.). Teiginys be nulio yra tiesioginis būdas pasakyti TypeScript kompiliatoriui, kad reikšmė niekada nebus nulinė arba neapibrėžta. Tai ypač naudinga, kai esame tikri, kad objektas egzistuos vykdymo metu, net jei „TypeScript“ negali to įrodyti kompiliavimo metu. Pavyzdžiui, in obj!.duomenys, mes sakome kompiliatoriui praleisti bet kokius nulinius patikrinimus ir manyti, kad obj egzistuoja. Šis metodas, nors ir patogus, gali sukelti vykdymo klaidos jei objektas pasirodo esąs niekinis arba neapibrėžtas.

Kita vertus, pasirenkamas grandinės operatorius suteikia saugesnį būdą pasiekti įdėtas ypatybes arba metodus objekte, kurie gali būti nuliniai. Tuo atveju, kai obj?.duomenys, kodas patikrina, ar objektas egzistuoja prieš bandant pasiekti duomenų ypatybę. Jei objektas yra nulinis arba neapibrėžtas, jis tiesiog grąžina neapibrėžtą, o ne pateikia klaidą. Šis metodas ypač naudingas dinaminėje aplinkoje, kur objektai gali būti sąlygiškai sukurti arba gauti iš išorinių šaltinių, pvz., API. Taip išvengiama strigčių ar netikėto elgesio, todėl jūsų kodas tampa geresnis atsparus.

Antrasis pavyzdys skirtas funkcijų iškvietimams naudojant šiuos operatorius. Nenuliais teiginiais priverčiame iškviesti metodą, darydami prielaidą, kad objektas ir metodas egzistuoja, kaip matyti iš obj!.doSomething(). Tai gali būti naudinga tais atvejais, kai kūrėjas visiškai kontroliuoja duomenis, tačiau tai kelia pavojų, jei prielaida nepavyks. Jei metodo nėra arba objektas yra nulinis, programa padarys išimtį. Dėl to nenuginčijamas tvirtinimas yra didelės rizikos ir didelio atlygio įrankis.

Pasirenkamas grandinės sujungimas, taikomas funkcijų iškvietimams, kaip nurodyta obj?.doSomething(), užkerta kelią tokioms vykdymo klaidoms, patikrindamas, ar metodas egzistuoja, prieš bandant jį iškviesti. Jei metodas ar objektas neapibrėžtas, nieko neįvyksta ir programa tęsia vykdymą, nepateikdama klaidos. Ši technika labai rekomenduojama tais atvejais, kai objektas gaunamas dinamiškai arba kai kuriais programos etapais gali būti neapibrėžtas. Tai užtikrina saugų vykdymą ir sumažina nuoseklaus nulio tikrinimo kodo poreikį, o tai pagerina abu pasirodymas ir kodo skaitomumą.

// Example 1: Using non-null assertion operator (!)
// The assumption here is that obj is definitely not null or undefined
const obj: { data?: string } | null = { data: 'Hello' };
const data: string = obj!.data;  // Non-null assertion, ignores potential null/undefined
console.log(data);  // Output: 'Hello'

// Example 2: Optional chaining (?.) for safer access
// This approach checks if obj exists before accessing data property
const obj2: { data?: string } | null = null;
const data2: string | undefined = obj2?.data;  // Safely returns undefined if obj2 is null
console.log(data2);  // Output: undefined

// Note: The first approach forces the compiler to assume obj is not null
// The second approach ensures no runtime error if obj is null or undefined

// Example 1: Using non-null assertion operator for function invocation
// Assumes obj is not null or undefined before invoking the method
const objFunc: { doSomething?: () => void } | null = { doSomething: () => console.log('Action') };
objFunc!.doSomething();  // Forces execution, assuming objFunc is valid

// Example 2: Optional chaining operator for function invocation
// This approach safely checks if objFunc exists before calling the method
const objFunc2: { doSomething?: () => void } | null = null;
objFunc2?.doSomething();  // No error thrown, simply does nothing if objFunc2 is null

// Conclusion: Non-null assertion is riskier but direct, while optional chaining is safer but may return undefined

// Unit Test 1: Testing non-null assertion operator (!)
import { expect } from 'chai';
it('should return data with non-null assertion', () => {
  const obj = { data: 'Test' };
  const result = obj!.data;
  expect(result).to.equal('Test');
});

// Unit Test 2: Testing optional chaining operator (?.)
it('should return undefined if obj is null using optional chaining', () => {
  const obj = null;
  const result = obj?.data;
  expect(result).to.be.undefined;
});

// Ensures both methods behave as expected in null/undefined scenarios

Pažangūs metodai: nenulinių tvirtinimų ir pasirenkamo grandininio sujungimo tyrimas

Be pagrindinių naudojimo atvejų ne niekinis tvirtinimas ir pasirenkamas grandinės sujungimas aptarta anksčiau, šie operatoriai taip pat atlieka lemiamą vaidmenį tvarkant sudėtingas duomenų struktūras, ypač didelės apimties programose. Dirbant su giliai įdėtais objektais arba dideliais duomenų rinkiniais, gautais iš API, dažnai susiduriama su scenarijais, kai tam tikros ypatybės gali egzistuoti arba nebūti skirtinguose programos gyvavimo ciklo etapuose. Naudodami pasirenkamą grandinės sujungimą, kūrėjai gali rašyti švaresnį ir labiau prižiūrimą kodą, pakartotinai nepridėdami nulinių kiekvienos hierarchijos nuosavybės patikrų.

Kitas svarbus aspektas, į kurį reikia atsižvelgti, yra tai, kaip šie operatoriai sąveikauja su griežtu TypeScript režimu. Griežtuoju režimu „TypeScript“ vykdo griežtesnius nulinius ir neapibrėžtus patikrinimus, todėl pasiekti galimai neapibrėžtas ypatybes tampa sudėtingiau. The ! operatorius leidžia kūrėjams apeiti „TypeScript“ įspėjimus apie galimas nulines reikšmes, tačiau jį reikia naudoti atsargiai, nes netinkamai naudojant gali atsirasti vykdymo klaidų. Todėl, ? operatorius dažnai pasirenkamas tais atvejais, kai objekto ar nuosavybės egzistavimas yra neaiškus.

Be to, naudojant pasirenkamą grandinės sujungimą kartu su kitomis šiuolaikinėmis „JavaScript“ funkcijomis, pvz numatytosios reikšmės (naudojant || arba ?? operatorius) gali žymiai pagerinti kodo saugumą ir skaitomumą. Pavyzdžiui, kūrėjai gali saugiai pasiekti objekto ypatybę ir pateikti atsarginę vertę, jei nuosavybė neapibrėžta. Tai ypač naudinga formų, naudotojo įvestyje ar konfigūracijoje, kur reikšmių gali nebūti arba jos gali būti neprivalomos, o tai dar labiau padidina kodo tvirtumą.