declare常见用法

declare就是告诉TS编译器你担保这些变量和模块存在，并声明了相应类型，编译的时候不需要提示错误

1.declare 如同 interface、type 关键词一样，在编译成 js 之后是会被删除的。 declare 声明的是一个变量
// 例子1：

#index.html
<script>
    var myMap = new Map();
</script>
<script src="./index.js"/>

#index.ts
myMap.set('key', 'value');

当你在 index.ts 中直接调用 myMap 的时候是会报错的，因为 TS 找不到 myMap 这个变量。如果用 const 或者 let 声明，
又会导致变量被覆盖，那么解决办法就是用 declare。

#index.ts
declare myMap: Map<string, string>; // 声明在运行上下文之中存在一个叫做 myMap 的变量
myMap.set('key', 'value');

2.declare module xxx {} 是用来做一些第三方库没有支持ts的，通过declare module，让我们在代码中可以import进来，从而使用它

// 一般来说这个 .d.ts 文件会被放在工程的更目录下，如：
#xxx.d.ts
declare module "test" {
  export var value: number;
  export function hello(str: string): String;
}
declare var D2: string;
declare namespace mySpace {
  interface ITest {
    id: number;
  }
}

// 这样子我们在文件中 import 那个没有支持ts的库就不会报错了，而且还会提示 库暴露出来的属性/方法
import test from "test";

test.hello('123');
test.value;
window.D2 = "hello";
const obj: mySpace.ITest = {id: 1};

// 上面的例子只有 declare module 才是定义一个模块，才能被 import，其他的用法如上

3.模块扩展

// 1.ts
export class AClass {
  public a:string;
  constructor(a:string) {
    this.a = a;
  }
 }

// 2.ts
import { AClass } from './1';
declare module './1' {
   interface AClass {
    test: (b: number) => number;
  }
}
AClass.prototype.test = (b: number): number => {
   return b;
}

4.全局扩展

// observable.ts
export class Observable<T> {
    // ... still no implementation ...
}
declare global {
    interface Array<T> {
        toObservable(): Observable<T>;
    }
}
Array.prototype.toObservable = function () {
    // ...
}