TypeScript: Operator !(wykrzyknik)

W TypeScript istnieje operator ?, który służy do poinformowania, że oznaczone w taki sposób wyrażenie jest opcjonalne:

const someFunction = (data?: string) => {
}

Jest to przydatne gdy chcemy określić, że na przykład parametr funkcji nie jest wymagany.

Zapis:

data: string | null

możemy zastąpić:

data?: string

Spójrzmy jeszcze na przykład:

interface Person {
  name: string;
  age: number;
}

const displayPersonInfo = (person?: Person) => {
  console.log('Name: ', person.name);
  console.log('Age: ', person.age);
}

Ponieważ w funkcji displayPersonInfo oznaczyliśmy parametr person jako opcjonalny, dostaniemy komunikat o błędzie przy próbie kompilacji. Próbujemy się dostać do właściwości obiektu (parametru), który może w ogóle nie zostać przekazany.

error TS2532: Object is possibly 'undefined'.

A co jeśli mam gwarancję, że do tej funkcji zawsze zostanie przekazany właściwy obiekt?

Operator !

Istnieje operator w TypeScript dzięki, któremu informujemy TS, że wiemy, co robimy. Dajemy gwarancję, że zostanie tam przekazany obiekt. Oto zapis:

const displayPersonInfo = (person?: Person) => {
  console.log('Name: ', person!.name);
  console.log('Age: ', person!.age);
}

Operator ! to tzw.: non-null assertion. Usuwa on z danego typu wartości null lub undefined informując TypeScript "puste" wartości nie zostaną przekazane.

Innym przykład użycia tego operatora to rozwiązanie poniższego problemu. To jest przykład z Angulara:

export class FormComponent implements OnInit {

  @Input()
  data: FormGroup;
	
	...
}	

Przy próbie kompilacji takiego kodu dostaniemy błąd:

error TS2564: Property 'data' has no initializer and is not definitely assigned in the constructor.

Przekazujemy do tego komponentu obiekt FormGroup, który nie jest "pusty". My to wiemy, ale TS nie. Wystarczy napisać:

@Input()
data!: FormGroup;

Problem rozwiązany.