咱是小羊
0%

Learning TypeScript From Scratch(1)

Posted on Edited on In

Basic Types

Referring TypeScript handbook.

Boolean

1
let isDone: boolean = false;

Number

  • support binary/octal/exadecimal
  • include number/bigint
1
2
3
4
5
let decimal: number = 6;
let hex: number = 0xf00d;
let binary: number = 0b1010;
let octal: number = 0o744;
let big: bigint = 100n;

String

1
2
let color: string = "blue";
let sentence: string = `Hello ${color}`;

Array

  • Two kinds of representation
1
2
let list: number[] = [1, 2, 3];
let list: Array<number> = [1, 2, 3];

Tuple

  • type is specified and could be recognized
  • could not access element beyond index
1
2
3
4
5
6
7
8
let x: [string, number];
x = ["hello", 10];              // OK
x = [10, "hello"];              // Error

console.log(x[0].substring(1)); // OK
console.log(x[1].substring(1)); // Error

x[3] = "world";                 // Error

Enum

  • begin from 0 but could be changed
  • indices could be set individually
  • index is available
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
// Start from 0
enum Color {
  Red,
  Green,
  Blue,
}

// Start from 1
enum Color {
  Red = 1,
  Green,
  Blue,
}

// Set individually
enum Color {
  Red = 1,
  Green = 4,
  Blue = 2,
}

let red: Color = Color.Red;
let green: Color = Color[4];

Unknown

  • variables that may come from dynamic content
  • could be narrowed
1
2
3
4
5
6
7
8
9
10
11
12
13
14
let notSure: unknown = 4;
notSure = "maybe a string instead";
notSure = true;

// Narrowed
declare const maybe: unknown;
const aNumber: number = maybe;     // Error
if (maybe === true) {
  const aBoolean: boolean = maybe; // OK
  const aString: string = maybe;   // Error
}
if (typeof maybe === "string") {
  ...
}

Any

  • when there is no need for type declaration
  • when we want to work with existing JavaScript and gradually opt-in and opt-out of type checking
  • could access arbitrary properties and their existence or type won’t be checked
  • could propagate through object
1
2
3
4
5
6
7
8
9
let looselyTyped: any = 4;
looselyTyped.whatever();
looselyTyped.toFixed();

let strictlyTyped: unknown = 4;
strictlyTyped.toFixed(); // Error: Object is of type 'unknown'

let looselyObj: any = {};
let d = looselyObj.a.b.c.d; // d is now of type 'any'

Void

  • opposite of any, means the absence of having any type at all
  • variables of this type can only be assigned null(only if –strictNullChecks is not specified) or undefined
1
2
3
4
5
6
function func(): void {
  console.log('Hello World!');
}

let unusable: void = undefined;
unusable = null; // When --strictNullChecks is not given

Null and Undefined

  • are subtypes of all other types(like number-type variable can be assigned null or undefined)
  • when using –strictNullChecks flag
    • null is only assignable to unknown/any/null
    • undefined is only assignable to unknown/any/undefined/void
1
2
let u: undefined = undefined;
let n: null = null;

Never

  • represent the type of values that never occur
  • subtype of every type
  • don’t have subtype(like any isn’t assignable to never)
1
2
3
4
5
6
7
8
9
10
11
12
// Function returning never must not have a reachable end point
function error(message: string): never {
  throw new Error(message);
}

function fail() {
  return error("Something failed");
}

function infiniteLoop(): never {
  while (true) {}
}

Object

Nothing special.

Type assertions

  • A way to tell the compiler “I know exactly the type, I know what I’m doing”
  • Two forms: as-syntax/angle-bracket-syntax
1
2
3
4
5
6
let someValue: unknown = "this is a string";

// as-syntax
let strLength: number = (someValue as string).length;
// angle-bracket-syntax
let strLength: number = (<string>someValue).length;

Uppercase and lowercase

Uppercase like Number, String, Boolean, Symbol, or Object do not refer to the language primitives, and almost never should be used as a type.