[Typescript] Merge Object into Window with Types

For example we want to have one object merge into Window with type information as well.

import { Equal, Expect } from "../helpers/type-utils";

const addAllOfThisToWindow = {
  add: (a: number, b: number) => a + b,
  subtract: (a: number, b: number) => a - b,
  multiply: (a: number, b: number) => a * b,
  divide: (a: number, b: number) => a / b,
};

Object.assign(window, addAllOfThisToWindow);

type tests = [
  Expect<Equal<typeof window.add, (a: number, b: number) => number>>,
  Expect<Equal<typeof window.subtract, (a: number, b: number) => number>>,
  Expect<Equal<typeof window.multiply, (a: number, b: number) => number>>,
  Expect<Equal<typeof window.divide, (a: number, b: number) => number>>,
];

 

We know that, dealing with Window, we need global.

declare global {
  interface Window {
  
  }
}

 

Also we know that, with Window, we have to use interface, instead of type.

 

With interface, we can actually use extends keyword to merge with existing interface.

interface Person {
    name: string
    age: number
}

interface Employee extends Person {
    company: string
}

const e: Employee = {
    name: 'zwan',
    age: 25,
    company: 'abc'
}

 

So that can help, to solve the problem we can do:

import { Equal, Expect } from '../helpers/type-utils';

declare global {
  type TAddToWindow = typeof addAllOfThisToWindow;
  interface Window extends TAddToWindow {}
}

const addAllOfThisToWindow = {
  add: (a: number, b: number) => a + b,
  subtract: (a: number, b: number) => a - b,
  multiply: (a: number, b: number) => a * b,
  divide: (a: number, b: number) => a / b,
};

Object.assign(window, addAllOfThisToWindow);

type tests = [
  Expect<Equal<typeof window.add, (a: number, b: number) => number>>,
  Expect<Equal<typeof window.subtract, (a: number, b: number) => number>>,
  Expect<Equal<typeof window.multiply, (a: number, b: number) => number>>,
  Expect<Equal<typeof window.divide, (a: number, b: number) => number>>
];