Skip to content

Commit eb6df56

Browse files
committed
add advanced types
1 parent 4be8169 commit eb6df56

File tree

1 file changed

+114
-0
lines changed
  • module8-typescript/r2-advanced-types

1 file changed

+114
-0
lines changed
Lines changed: 114 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,114 @@
1+
# Advanced Types
2+
In this module, we will cover some advanced types in TypeScript.
3+
4+
## Enums
5+
Enumerated types (also known as enums or enumerations) are a feature of TypeScript that is not present
6+
explicitly in JavaScript. Enumerations are useful to represent a set of fixed
7+
constants, and they are usually preferable to [magic
8+
strings](https://en.wikipedia.org/wiki/Magic_string) in order to achieve this.
9+
10+
For example, we may want to use an enum to represent the possible types of
11+
subscriptions in an application, given that our hypothetical app only supports
12+
four possible types of plans. If we need to support more later, then we can add
13+
to the enum.
14+
15+
```typescript
16+
enum SubscriptionType {
17+
ONE_MONTH,
18+
TWO_MONTH,
19+
THREE_MONTH,
20+
ONE_YEAR
21+
}
22+
```
23+
24+
They are useful anywhere we have a fixed set of items that need to be
25+
represented:
26+
```typescript
27+
enum Theme {
28+
DARK,
29+
LIGHT,
30+
GREY
31+
}
32+
```
33+
34+
And they can often be combined with switch-cases:
35+
```typescript
36+
function getPrimaryColor(userTheme: Theme) {
37+
switch (userTheme) {
38+
case Theme.DARK:
39+
return "black";
40+
return "white";
41+
case Theme.GREY:
42+
return "grey";
43+
// Fall back to light theme in case of unsupported theme,
44+
// perhaps caused by developer error of forgetting to support the
45+
// enum in this function.
46+
case Theme.LIGHT:
47+
default:
48+
return "blue";
49+
}
50+
}
51+
```
52+
53+
## Intersection types
54+
Previously, we discussed union types, such as `string | undefined`, meaning that
55+
a value could be either of type `string` or type `undefined`. However, an
56+
intersection type instead *combines* all of the given types.
57+
58+
59+
```typescript
60+
61+
## `void`
62+
The `void` type is used to represent the absence of any return type. Usually,
63+
providing the return type is optional, so you will not have to explicitly write
64+
it out. `console.log()` is an example of a well-known function with a `void`
65+
return type: the return type is never used.
66+
67+
For example, a function that does only logging might have a return type of of
68+
`void`:
69+
70+
```typescript
71+
function warnUser(): void {
72+
console.log("This is my warning message");
73+
}
74+
```
75+
76+
## Utility types
77+
78+
### Partials
79+
The `Partial<T>` type takes a type `T` but makes all of its properties optional. That
80+
is, none of the types will be required on the resulting type.
81+
82+
```typescript
83+
// Note how the fields are required in this type.
84+
interface FullName {
85+
firstName: string;
86+
lastName: string;
87+
}
88+
89+
const optionalLastName: Partial<FullName> = { firstName: "Foo" };
90+
```
91+
92+
In contrast, the `Required<T>` type takes a type `T`, but all types must be
93+
provided.
94+
95+
```typescript
96+
interface Person {
97+
firstName: string;
98+
// Note the optional field.
99+
lastName?: string;
100+
}
101+
102+
const needsLastName: Required<Person> = { firstName: "Foo" };
103+
```
104+
105+
This gives an error:
106+
```
107+
Property 'lastName' is missing in type '{ firstName: string; }' but required in
108+
type 'Required<Person>'.
109+
```
110+
111+
TypeScript provides a number of similar utility types that derive from another
112+
type, such as `Readonly` (makes a type read-only, disallowing assignment), `Pick`
113+
(taking only certain fields), and so on. The full list of [utility
114+
types is available in the documentation](https://www.typescriptlang.org/docs/handbook/utility-types.html).

0 commit comments

Comments
 (0)