Typy w TypeScript: string, number, boolean i inne

Typy w TypeScript opisują, jakiego rodzaju wartość może przechowywać zmienna. Typ piszesz po dwukropku, let name: string, a kompilator odrzuca każdy kod, który umieszcza tam wartość złego rodzaju. Typy podstawowe to siedem typów prostych JavaScriptu oraz typy obiektowe dla tablic i obiektów.

let title: string = "TypeScript";
let version: number = 7;
let isStrict: boolean = true;
let big: bigint = 9007199254740993n;
let id: symbol = Symbol("id");
let nothing: null = null;
let notSet: undefined = undefined;

let scores: number[] = [90, 72, 85];
let user: { name: string; age: number } = { name: "Ada", age: 36 };

console.log(title, version, isStrict, big, id);
console.log(nothing, notSet);
console.log(scores, user);

Adnotacje są sprawdzane w czasie kompilacji, a potem usuwane. Uruchamiany program to zwykły JavaScript.

Typy proste

Nazwy typów pisze się małymi literami. typeof w czasie działania zwraca dla większości z nich te same słowa, więc typeof x === "number" to sposób na sprawdzenie typu prostego wartości podczas działania programu.

Adnotacje typów

Adnotacja to : Type po zmiennej, parametrze albo liście parametrów funkcji. Najważniejsze są adnotacje parametrów, bo TypeScript nie zgadnie, co przekaże wywołujący.

function describe(name: string, age: number, admin: boolean): string {
    return `${name} (${age})${admin ? " [admin]" : ""}`;
}

let label: string = describe("Ada", 36, true);
console.log(label); // Ada (36) [admin]

// Without an annotation, TypeScript infers the type from the value:
let count = 10; // count: number
count = count + 1;
console.log(count); // 11

Gdy zmienna jest inicjalizowana w tej samej linii, adnotacja jest zwykle zbędna: let count = 10 ma już typ number. Zasady pomijania typów opisuje strona o wnioskowaniu typów.

Zły typ to błąd kompilacji

Przypisz wartość złego typu, a kompilator zatrzyma się, zanim cokolwiek się uruchomi:

// This does not compile: a string is not a number.
let port: number = 8080;
port = "3000";
console.log(port);

Kompilator wypisuje:

index.ts(3,1): error TS2322: Type 'string' is not assignable to type 'number'.

Poprawka to konwersja wartości, port = Number("3000"), albo zmiana adnotacji, jeśli zmienna naprawdę powinna przechowywać tekst.

number: nie ma typu całkowitego

JavaScript przechowuje każdą liczbę jako 64-bitową wartość zmiennoprzecinkową, więc TypeScript ma jeden typ number. Liczby całkowite są dokładne do Number.MAX_SAFE_INTEGER (2 ** 53 - 1). Powyżej tej wartości użyj bigint.

let price: number = 19.99;
let quantity: number = 3; // also number: no int type

console.log(Number.isInteger(quantity)); // true
console.log(Number.isInteger(price));    // false
console.log(Math.trunc(7 / 2));          // 3 (integer division)
console.log(0.1 + 0.2);                  // 0.30000000000000004

console.log(Number.MAX_SAFE_INTEGER);     // 9007199254740991
console.log(Number.MAX_SAFE_INTEGER + 2); // 9007199254740992 (wrong)

let exact: bigint = 9007199254740991n + 2n;
console.log(exact); // 9007199254740993n

// @ts-expect-error: bigint and number cannot be mixed
const mixed = () => exact + 1;
console.log(exact + BigInt(1), Number(exact)); // 9007199254740994n 9007199254740992

bigint i number się nie mieszają: exact + 1 to błąd kompilacji (TS2365: Operator '+' cannot be applied to types 'bigint' and '1'., gdzie '1' to typ literałowy liczby 1), a gdyby się kiedyś uruchomiło, także TypeError w czasie działania. Przekonwertuj jedną stronę jawnie przez BigInt(1) albo Number(exact), pamiętając, że Number zaokrągla wartości spoza bezpiecznego zakresu.

Jeśli chcesz typu, który przyjmuje tylko liczby całkowite, TypeScript nie potrafi go wyrazić dla dowolnych wartości. Waliduj przez Number.isInteger tam, gdzie wartość wchodzi do programu.

boolean

boolean ma dokładnie dwie wartości, true i false. Wartości, które są tylko prawdziwe logicznie (1, "yes"), nie są typu boolean, więc zamień je na boolean przez Boolean(x) albo x !== 0.

let loggedIn: boolean = false;
const items: string[] = ["a", "b"];

const hasItems: boolean = items.length > 0;
const hasName: boolean = Boolean("Ada");

console.log(loggedIn, hasItems, hasName); // false true true

null i undefined

Przy włączonym strict (domyślnie od TypeScript 6.0) null i undefined to osobne typy i nie należą do string, number ani żadnego innego typu. Zmienna, która może być pusta, mówi o tym przez unię:

let nickname: string | undefined;
console.log(nickname); // undefined

nickname = "Ace";
console.log(nickname.toUpperCase()); // ACE

let middleName: string | null = null;
console.log(middleName ?? "(none)"); // (none)

Odczyt właściwości wartości, która może być undefined, to błąd kompilacji, dopóki jej nie sprawdzisz. Sprawdzenia, ?. i ?? opisuje strona o null i undefined.

Tablice i obiekty w skrócie

Wszystko, co nie jest typem prostym, to typ obiektowy. Trzy kształty, które spotkasz najpierw:

let tags: string[] = ["ts", "js"];               // array of strings
let point: { x: number; y: number } = { x: 1, y: 2 }; // object with two number properties
let greet: (name: string) => string = (n) => `hi ${n}`; // function type

Każdy z nich ma własną stronę: tablice, krotki (tablice o stałej długości), typy obiektowe i typy funkcji.

string, number, boolean a String, Number, Boolean

Nazwy wielką literą to typy obiektów opakowujących JavaScriptu (new String("x")), a nie zwykłych wartości. W adnotacjach używaj nazw małymi literami.

// This does not compile: String (the wrapper) is not string (the primitive).
const wrapped: String = "text";
const plain: string = wrapped;
console.log(plain);

index.ts(3,7): error TS2322: Type 'String' is not assignable to type 'string'.
  'string' is a primitive, but 'String' is a wrapper object. Prefer using 'string' when possible.

Zmień String na string w pierwszej linii, a blok się uruchomi. To samo dotyczy Number, Boolean, Symbol i BigInt. (Object to inny przypadek: przyjmuje prawie każdą wartość, łącznie z typami prostymi; zobacz typy obiektowe).

Inne wbudowane typy

Kilka kolejnych typów pojawia się wcześnie. Każdy ma własną stronę.