Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://www.sitepen.com/blog/typescript-cheat-sheet below:

TypeScript 5.0 Cheat Sheet - SitePen

Originally published November 2018. Updated June 2023 for TypeScript 5.0.

npm install TypeScript

npx tsc

npx tsc --project configs/my_tsconfig.json

function getValue(val?: number): number | 'nil' {
  
  

  
  return val ?? 'nil';
}

function countCaps(value?: string) {
  
  
  return value?.match(/[A-Z]/g)?.length ?? 0;
}

let value: string | undefined;




console.log(`value is ${value!.length} characters long`);

let a;
let b = 1;
 

 
a &&= 'default'; 
b &&=  5; 

let a;
let b = 1;
 

 
a ||= 'default'; 
b ||=  5; 

let a;
let b = 0;
 

 
a ??= 'default'; 
b ??=  5; 

any

string

${string}Suffix

number

boolean

object

undefined

null

void

never

unknown

{
    requiredStringVal: string;
    optionalNum?: number;
    readonly readOnlyBool: bool;
}

{ [key: string]: Type; }
{ [key: number]: Type; }
{ [key: symbol]: Type; }
{ [key: `data-${string}`]: Type; }

let direction: 'left' | 'right';

let roll: 1 | 2 | 3 | 4 | 5 | 6;

string[]

or

Array<string>

(() => string)[]

or

{ (): string; }[]

or

Array<() => string>

let myTuple: [ string, number, boolean? ];

myTuple = [ 'test', 42 ];

type Numbers = [number, number];
type Strings = [string, string];
 
type NumbersAndStrings = [...Numbers, ...Strings]; 


type NumberAndRest = [number, ...string[]];


type RestAndBoolean = [...any[], boolean]; 

type Vector2D = [x: number, y: number];
function createVector2d(...args: Vector2D) {} 

(arg1: Type, argN: Type) => Type;

or

{ (arg1: Type, argN: Type): Type; }

new () => ConstructedType;

or

{ new (): ConstructedType; }

(arg1: Type, optional?: Type) => ReturnType

(arg1: Type, ...allOtherArgs: Type[]) => ReturnType

{ (): Type; staticProp: Type; }

function fn(arg1 = 'default'): ReturnType {}

(arg1: Type): ReturnType => { ...; return value; }

or

(arg1: Type): ReturnType => value;

function fn(this: Foo, arg1: string) {}

function conv(a: string): number;
function conv(a: number): string;
function conv(a: string | number): string | number {
    ...
}

let myUnionVariable: number | string;

let myIntersectionType: Foo & Bar;

interface Child extends Parent, SomeClass {
    property: Type;
    optionalProp?: Type;
    optionalMethod?(arg1: Type): ReturnType;
}

class Child
extends Parent

implements Child, OtherChild {
    property: Type;
    defaultProperty = 'default value';
    private _privateProperty: Type;
    private readonly _privateReadonlyProperty: Type;
    static staticProperty: Type;

    static {
        try {
            Child.staticProperty = calcStaticProp();
        } catch {
            Child.staticProperty = defaultValue;
        }
    }

    constructor(arg1: Type) {
        super(arg1);
    }

    private _privateMethod(): Type {}

    methodProperty: (arg1: Type) => ReturnType;
    overloadedMethod(arg1: Type): ReturnType;
    overloadedMethod(arg1: OtherType): ReturnType;
    overloadedMethod(arg1: CommonT): CommonReturnT {}
    static staticMethod(): ReturnType {}
    subclassedMethod(arg1: Type): ReturnType {
        super.subclassedMethod(arg1);
    }
}

enum Options {
    FIRST,
    EXPLICIT = 1,
    BOOLEAN = Options.FIRST | Options.EXPLICIT,
    COMPUTED = getValue()
}

enum Colors {
    Red = "#FF0000",
    Green = "#00FF00",
    Blue = "#0000FF"
}

    type Name = string;

    type Direction = 'left' | 'right';

    type ElementCreator = (type: string) => Element;

    type Point = { x: number, y: number };

    type Point3D = Point & { z: number };

    type PointProp = keyof Point; 

    const point: Point = { x: 1, y: 2 };

    type PtValProp = keyof typeof point; 

<T>(items: T[], callback: (item: T) => T): T[]

interface Pair<T1, T2> {
    first: T1;
    second: T2;
}

<T extends ConstrainedType>(): T

<T = DefaultType>(): T

<T extends ConstrainedType = DefaultType>(): T

type Arr = readonly any[];
 
function concat<U extends Arr, V extends Arr>(a: U, b: V): 
[...U, ...V] { return [...a, ...b] }
 
const strictResult = concat([1, 2] as const, ['3', '4'] as const);
const relaxedResult = concat([1, 2], ['3', '4']);
 

type Point = { x: number, y: number };
let pointProp: keyof Point = 'x';

function getProp<T, K extends keyof T>(
    val: T,
    propName: K

): T[K] { ... }

type Stringify<T> = { [P in keyof T]: string; }
type Partial<T> = { [P in keyof T]?: T[P]; }

type Swapper = <T extends number | string>
    (value: T) => T extends number ? string : number;

is equivalent to

(value: number) => string

if T is number, or

(value: string) => number

if T is string

interface Person {
    firstName: string;
    lastName: string;
    age: number;
}

type StringProps<T> = {
    [K in keyof T]: T[K] extends string ? K : never;
};

type PersonStrings = StringProps<Person>;

type A = Awaited<Promise<string>>;


type B = Awaited<Promise<Promise<number>>>;


type C = Awaited<boolean | Promise<number>>;

Partial<{ x: number; y: number; z: number; }>

is equivalent to

{ x?: number; y?: number; z?: number; }

Readonly<{ x: number; y: number; z: number; }>

is equivalent to

{
    readonly x: number;

    readonly y: number;

    readonly z: number;

}

Pick<{ x: number; y: number; z: number; }, 'x' | 'y'>

is equivalent to

{ x: number; y: number; }

Record<'x' | 'y' | 'z', number>

is equivalent to

{ x: number; y: number; z: number; }

type Excluded = Exclude<string | number, string>;

is equivalent to

number

type Extracted = Extract<string | number, string>;

is equivalent to

string

type NonNull = NonNullable<string | number | void>;

is equivalent to

string | number

type ReturnValue = ReturnType<() => string>;

is equivalent to

string

class Renderer() {}
type Instance = InstanceType<typeof Renderer>;

is equivalent to

Renderer

function isThing(val: unknown): val is Thing {
    
}

if (isThing(value)) {
    
}

declare value: string | number | boolean;
const isBoolean = typeof value === “boolean”;

if (typeof value === "number") {
    
} else if (isBoolean) {
    
} else {
    
}

declare value: Date | Error | MyClass;

const isMyClass = value instanceof MyClass;

if (value instanceof Date) {
    
} else if (isMyClass) {
    
} else {
    
}

interface Dog { woof(): void; }
interface Cat { meow(): void; }

function speak(pet: Dog | Cat) {
    if ('woof' in pet) {
        pet.woof()
    } else {
        pet.meow()
    }
}

let val = someValue as string;

or

let val = <string>someValue;

let point = { x: 20, y: 30 } as const;

or

let point = <const>{ x: 20, y: 30 };

declare const $: JQueryStatic;

declare module "foo" {
    export class Bar { ... }
}

declare module "text!*" {
    const value: string;
    export default value;
}

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4