Typescript Basic Concepts
Unions
Expanding a value’s allowed type to be two or more possible types
Declaring Union Types
Union Properties
When a value is known to be a union type, TypeScript will only allow you to access member properties that exist on all possible types in the union. It will give you a type-checking error if you try to access a type that doesn’t exist on all possible types.
Restricting access to properties that don’t exist on all union types is a safety measure. If an object is not known to definitely be a type that contains a property, TypeScript will believe it unsafe to try to use that property. The property might not exist!
To use a property of a union typed value that only exists on a subset of the potential types, your code will need to indicate to TypeScript that the value at that location in code is one of those more specific types: a process called narrowing.
Narrowing
Narrowing is when TypeScript infers from your code that a value is of a more specific type than what it was defined, declared, or previously inferred as. Once TypeScript knows that a value’s type is more narrow than previously known, it will allow you to treat the value like that more specific type.
A lo gical check that can be used to narrow types is called a type guard
1) Assignment Narrowing
Assignment narrowing comes into play when a variable is given an explicit union type annotation.
If you directly assign a value to a variable, TypeScript will narrow the variable’s type to that value’s type.
If you give initial value to a variable, TypeScript will narrow the variable’s type to that value’s type. TypeScript will understand that while the variable may later receive a value of any of the union typed values, it starts off as only the type of its initial value.
2) Conditional Checks
Another way to get TypeScript to narrow a variable’s value is to write an if statement checking the variable for being equal to a known value. TypeScript is smart enough to understand that inside the body of that if statement, the variable must be the same type as the known value.
Type Script’s type-checking logic mirroring good JavaScript coding patterns. If a variable might be one of several types, you’ll generally want to check its type for being what you need.
3) Typeof Checks
In addition to direct value checking, TypeScript also recognizes the typeof operator in narrowing down variable types.
Literal Types
Literal types are a type of value in TypeScript that represent exact values rather than a range of possible values.
boolean: justtrue|falsenullandundefined: both just have one literal value, themselvesnumber: infinite number of literal typess tring: infinite number of literal types
Variables Without Initial Values
TypeScript is smart enough to understand that the variable is undefined until a value is assigned. It will report a specialized error message if you try to use that variable, such as by accessing one of its properties, before assigning a value:
Note that this reporting doesn’t apply if the variable’s type includes undefined.
Adding | undefined to a variable’s type indicates to TypeScript that it doesn’t need to be defined before use, as undefined is a valid type for its value.
The previous code snippet wouldn’t emit any errors if the type of mathematician is string | undefined:
