( << Back) TypeNarrowing.ts
1: //https://www.vb-net.com/TsLecture/Index.htm#Narrowing
2: // 1. JS Typeof Guard
3: // 2. Truthiness guard (check by IF). These values {0, NaN, "" (the empty string), 0n (the bigint version of zero), null, undefined} - always get False on IF checking. Other get True on IF checking.
4: // 3. Equality narrowing. Comparing without transformation to one type (===, !==) or with transformation to one type (==, !=).
5: // 4. IN narrowing - check if object of prototype has property
6: // 5. InstanceOf narrowing - check prototype chain, and object created with New
7: // 6. Type predicates AS - TypeScript will narrow that variable to that specific type if the original type is compatible
8: // 7. Discriminated unions - store literal as one of property
9: // 8. Using Never type to receive exception if type is wrong
10: // 9. Non-null Assertion Operator (Postfix !)
11:
12: //https://www.typescriptlang.org/docs/handbook/2/narrowing.html#handbook-content
13:
14: console.log(`
15: --- 1 --- JS Typeof Guard.
16: `)
17:
18: //js TypeOf return https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/typeof
19: // "string", "number", "bigint", "boolean", "symbol", "undefined", "object", "function", (typeof null === "object";)
20:
21: function padLeft(padding: number | string, input: string) {
22: if (typeof padding === "number") {
23: return " ".repeat(padding) + input;
24: }
25: return padding + input;
26: }
27:
28: console.log(`
29: --- 2 --- Truthiness guard (check by IF). These values {0, NaN, "" (the empty string), 0n (the bigint version of zero), null, undefined} - always get False on IF checking. Other get True on IF checking.
30: `)
31:
32: function multiplyAll(
33: values: number[] | undefined,
34: factor: number
35: ): number[] | undefined {
36: if (!values) {
37: return values;
38: } else {
39: return values.map((x) => x * factor);
40: }
41: }
42:
43: console.log(`
44: --- 3 --- Equality narrowing. Comparing without transformation to one type (===, !==) or with transformation to one type (==, !=).
45: `)
46:
47: function printAll(strs: string | string[] | null) {
48: if (strs !== null) {
49: if (typeof strs === "object") {
50: for (const s of strs) {
51: console.log(s);
52: }
53: } else if (typeof strs === "string") {
54: console.log(strs);
55: }
56: }
57: }
58:
59: console.log(`
60: --- 4 --- IN narrowing - check if object of prototype has property
61: `)
62:
63: type Fish = { swim: () => void };
64: type Bird = { fly: () => void };
65:
66: function move(animal: Fish | Bird) {
67: if ("swim" in animal) {
68: return animal.swim();
69: }
70:
71: return animal.fly();
72: }
73:
74: console.log(`
75: --- 5 --- InstanceOf narrowing - check prototype chain, and object created with New
76: `)
77:
78: function logValue(x: Date | string) {
79: if (x instanceof Date) {
80: console.log(x.toUTCString());
81: } else {
82: console.log(x.toUpperCase());
83: }
84: }
85:
86: console.log(`
87: --- 6 --- Type predicates AS - TypeScript will narrow that variable to that specific type if the original type is compatible
88: `)
89:
90: function isFish(pet: Fish | Bird): pet is Fish {
91: return (pet as Fish).swim !== undefined;
92: }
93:
94: console.log(`
95: --- 7 --- Discriminated unions - store literal as one of property
96: `)
97:
98: interface Circle {
99: kind: "circle";
100: radius: number;
101: }
102:
103: interface Square {
104: kind: "square";
105: sideLength: number;
106: }
107:
108: type Shape2 = Circle | Square;
109:
110: console.log(`
111: --- 8 --- Using Never type to receive exception if type is wrong
112: `)
113:
114: type Shape3 = Circle | Square;
115:
116: function getArea2(shape: Shape3) {
117: switch (shape.kind) {
118: case "circle":
119: return Math.PI * shape.radius ** 2;
120: case "square":
121: return shape.sideLength ** 2;
122: default:
123: const _exhaustiveCheck: never = shape;
124: return _exhaustiveCheck;
125: }
126: }
127:
128: console.log(`
129: --- 9--- non-null assertion (!) to say that radius is definitely present.
130: `)
131:
132: function getArea(shape: Shape) {
133: if (shape.kind === "circle") {
134: return Math.PI * shape.radius! ** 2;
135: }
136: }
Comments (
)
Link to this page:
http://www.vb-net.com/TypescriptLearningStartPoint/TypeNarrowing.htm
|