Typescript: Add customer properties in window or primitive prototype.

 

1. Errors, When access customer properties.

window.info // error: Property 'info' does not exist on type 'Window & typeof globalThis'.ts(2339)

2. Add properties to the interface of the window

interface Window {
    info: object
}

window.info

// no errors

3. Also Errors inside a Module

interface Window { // It belongs to this module, no global.
    info: object
}

window.info // // error: Property 'info' does not exist on type 'Window & typeof globalThis'.ts(2339)

export {}

declare global

declare global {
    interface Window {
        info: object
    }
}


window.info // no errors

export {}

4. Add properties to the Primitive types.

declare global {
    interface Number {
        toFixed2(): void
    }
}

Number.prototype.toFixed2 // no errors

export {}

5. Best Practice, move the interfaces to the global.d.ts

// global.d.ts
interface Window {
    info: object
}
interface Number {
    toFixed2(): void
}

// myModules.ts
window.info // no errors

Number.prototype.toFixed2 // no errors

export {}

6. Put other variables in global

// global.d.ts
interface Window {
    info: object
}
interface Number {
    toFixed2(): void
}

declare namespace myLib {
    let timeout: number;
}

// myModules.ts
window.info

Number.prototype.toFixed2

myLib.timeout = 4444; // no errors

export {}