TypeScript Cheat Sheet
Aranabilir, yazdırılabilir bir TypeScript referansı — türler, arayüzler, generics, utility türleri, daraltma, bildirim dosyaları ve tsconfig. Ücretsiz.
Basic types
14let name: string = "Ada";
let age: number = 30;
let ok: boolean = true;
let ids: number[] = [1, 2];
let pair: [string, number] = ["a", 1];
let anything: unknown;
let loose: any;
function log(): void {}
function fail(): never { throw new Error(); }
let big: bigint = 9007199254740993n;
let id: string | null = null;
const point = { x: 1 } as const;
enum Status { Active, Inactive }
type Dir = "up" | "down";
Interfaces & type aliases
12interface User { id: number; name: string; }
type User = { id: number; name: string };
interface User { nickname?: string; }
interface User { readonly id: number; }
interface Admin extends User { role: string; }
type Admin = User & { role: string };
interface Dict { [key: string]: number; }
interface Fn { (x: number): string; }
interface User { greet(): void; }
interface Box<T> { value: T; }
interface Window { myGlobal: string; }
type Point = Readonly<{ x: number }>;
Unions, intersections & narrowing
12type Id = string | number;
type Full = A & B;
if (typeof id === "string") { ... }
if (el instanceof HTMLElement) { ... }
if ("radius" in shape) { ... }
if (value != null) { ... }
switch (shape.kind) { case "circle": ... }
type Shape = Circle | Square;
const x = cond ? a : b;
user?.address?.city
const name = input ?? "default";
function assertNever(x: never): never { throw x; }
Generics
11function first<T>(arr: T[]): T { return arr[0]; }
first<string>(["a", "b"])
interface Box<T> { value: T; }
class Stack<T> { items: T[] = []; }
type Pair<K, V> = { key: K; value: V };
<T extends { id: number }>
<T, K extends keyof T>(obj: T, key: K): T[K]
<T = string>
function wrap<const T>(v: T): T[]
type Flatten<T> = T extends Array<infer U> ? U : T;
const map = new Map<string, User>();
Utility types
14Partial<User>
Required<User>
Readonly<User>
Pick<User, "id" | "name">
Omit<User, "password">
Record<string, number>
Exclude<T, U>
Extract<T, U>
NonNullable<T>
ReturnType<typeof fn>
Parameters<typeof fn>
Awaited<Promise<string>>
InstanceType<typeof MyClass>
Uppercase<"id"> / Capitalize<"id">
Functions & overloads
11function add(a: number, b: number): number
const add = (a: number, b: number) => a + b;
function log(msg: string, level?: string)
function log(msg: string, level = "info")
function sum(...nums: number[]): number
type Handler = (e: Event) => void;
function get(id: number): User;
function get(ids: number[]): User[];
function get(x: any): any { ... }
function fn(this: HTMLElement, e: Event)
async function load(): Promise<User>
function isUser(x: unknown): x is User
const fn: typeof otherFn = ...;
Classes
12class User { constructor(public name: string) {} }
private secret: string;
#secret: string;
protected id: number;
readonly createdAt = new Date();
static create(): User { return new User(); }
class Admin extends User { ... }
class Api implements Fetcher { ... }
abstract class Shape { abstract area(): number; }
get fullName(): string { return ...; }
override toString(): string { ... }
declare id: number;
Type guards & assertions
11function isUser(x: unknown): x is User
function assertUser(x: unknown): asserts x is User
function assertOk(x: unknown): asserts x
const el = input as HTMLInputElement;
value!
x as unknown as Y
const roles = ["admin", "user"] as const;
if (Array.isArray(value)) { ... }
satisfies Record<string, string>
typeof x === "object" && x !== null
catch (e) { if (e instanceof Error) ... }
Mapped & conditional types
12type Flags<T> = { [K in keyof T]: boolean };
{ [K in keyof T]?: T[K] }
{ [K in keyof T]-?: T[K] }
{ readonly [K in keyof T]: T[K] }
{ -readonly [K in keyof T]: T[K] }
{ [K in keyof T as `get${Capitalize<string & K>}`]: () => T[K] }
type IsString<T> = T extends string ? true : false;
T extends (infer U)[] ? U : never
type Keys = keyof User;
type Value = User["name"];
type Route = `/users/${number}`;
T extends any ? T[] : never
Modules & declaration files
12export interface User { ... }
export default class Api { ... }
import { User } from "./user";
import type { User } from "./user";
export type { User };
import * as path from "node:path";
declare module "my-lib" { ... }
declare global { interface Window { ... } }
declare const VERSION: string;
export {};
/// <reference types="node" />
npm i -D @types/lodash
tsconfig essentials
13"strict": true
"target": "ES2022"
"module": "ESNext"
"moduleResolution": "bundler"
"noEmit": true
"esModuleInterop": true
"skipLibCheck": true
"noUncheckedIndexedAccess": true
"paths": { "@/*": ["./src/*"] }
"outDir": "./dist", "rootDir": "./src"
"sourceMap": true, "declaration": true
npx tsc --noEmit
npx tsc --init
“:q” ile eşleşen bir girdi yok.
TypeScript Cheat Sheet Hakkında
Bu TypeScript cheat sheet, tür sistemini tek bir aranabilir sayfaya dönüştürür: temel türler, arayüzler ve tür takma adları, birleşimler, kesişimler ve daraltma, generics, yerleşik utility türleri, fonksiyonlar ve aşırı yüklemeler, sınıflar, tür koruyucuları ve iddialar, eşlenmiş ve koşullu türler, modüller ve bildirim dosyaları ve önemli tsconfig seçenekleri.
Günlük çalışma için yazılmıştır — bir generic kısıtlamanın tam yapısı, Pick, Omit, Record ve ReturnType'ın ne yaptığı, ayrımlı bir birleşimin nasıl daraldığı, ne zaman bir dönüşüm yerine `satisfies` kullanılacağı — böylece el kitabı için editörünüzden ayrılmadan bir ayrıntıyı kontrol edebilirsiniz.
Bu gruptaki her cheat sheet gibi ücretsiz ve istemci tarafındadır: arama kutusuyla satırları canlı olarak filtreleyin, yapışkan içindekiler tablosundan bölümler arasında atlayın, herhangi bir kod parçasını tek tıklamayla kopyalayın ve sayfayı masanızda referans olarak yazdırın.
TypeScript Cheat Sheet Nasıl Kullanılır
- Sayfayı açın ve bölümleri gözden geçirin, Temel türler ve Generics'ten tsconfig temellerine kadar.
- Partial, narrowing veya satisfies gibi bir anahtar kelime arayarak her satırı canlı olarak filtreleyin.
- Gelişmiş tür düzeyinde söz dizimine ihtiyacınız olduğunda Utility türleri veya Eşlenmiş ve koşullu türler bölümüne atlayın.
- TypeScript'i panonuza kopyalamak için bir kod parçasına veya kopyala simgesine tıklayın.
- Tam TypeScript referansının kağıt kopyası için Yazdır'ı kullanın.