1. 簡介

declare關(guān)鍵字用來告訴編譯器，某個類型是存在的，可以在當(dāng)前文件中使用。

作用：就是讓當(dāng)前文件可以使用其他文件聲明的類型。比如，自己的腳本使用外部庫定義的函數(shù)，編譯器會因?yàn)椴恢劳獠亢瘮?shù)的類型定義而報(bào)錯，這時(shí)就可以在自己的腳本里面使用declare關(guān)鍵字，告訴編譯器外部函數(shù)的類型，這樣編譯腳本就不會因?yàn)槭褂昧送獠款愋投鴪?bào)錯。

declare關(guān)鍵字可以描述變量、type或者interface命令聲明的類型、class、Enum、函數(shù)、模塊和命名空間。

declare關(guān)鍵字最重要的特點(diǎn)是，它只是通知編譯器某個類型是存在的，不用給出具體實(shí)現(xiàn)。比如只描述函數(shù)的類型，不給出函數(shù)的實(shí)現(xiàn)，如果不使用declare，是做不到的。

declare只能用來描述已經(jīng)存在的變量和數(shù)據(jù)結(jié)構(gòu)，不能用來聲明新的變量和數(shù)據(jù)結(jié)構(gòu)。另外所有declare語句都不會出現(xiàn)在編譯后的文件里面。

2. declare variable

可以給出外部變量的類型描述。比如當(dāng)前腳本使用了其他腳本定義的全局變量x，因?yàn)楫?dāng)前腳本不知道它的類型，編譯器會報(bào)錯，而此時(shí)要是使用declare命令給出它的類型，就不會報(bào)錯。

x = 123; // 報(bào)錯
declare let x:number;
x = 1;

如果declare關(guān)鍵字沒有給出變量的具體類型，則變量類型為any。

如果ts沒有找到declare關(guān)鍵字給出的變量，則假定它的類型為any。

declare 關(guān)鍵字只用來給出類型描述，是純的類型代碼，不允許設(shè)置變量的初始值，不涉及到值，否則會報(bào)錯。

// 報(bào)錯
declare let x:number = 1;

3. declare function

declare關(guān)鍵字可以給出外部函數(shù)的類型。

declare function sayHello(
  name:string
):void;

sayHello('張三');

在ts中不能單獨(dú)的聲明函數(shù)類型

// 報(bào)錯
function sayHello(
  name:string
):void;
function sayHello(name) {
  return '你好，' + name;
}

4. declare class

declare可以給出class類型的描述

declare class Animal {
  constructor(name:string);
  eat():void;
  sleep():void;
}

5. declare module、declare namespace

如果想把變量、函數(shù)、類組織在一起，可以將declare與module或namespace一起使用。

declare namespace AnimalLib {
  class Animal {
    constructor(name:string);
    eat():void;
    sleep():void;
  }

  type Animals = 'Fish' | 'Dog';
}

// 或者
declare module AnimalLib {
  class Animal {
    constructor(name:string);
    eat(): void;
    sleep(): void;
  }

  type Animals = 'Fish' | 'Dog';
}

declare module 和 declare namespace 里面，加不加 export 關(guān)鍵字都可以。

declare namespace Foo {
  export var a: boolean;
}

declare module 'io' {
  export function readFile(filename:string):string;
}

例子：使用外部庫(myLib)

declare namespace myLib {
  function makeGreeting(s:string): string;
  let numberOfGreetings: number;
}

可以為外部模塊添加屬性和方法時(shí)，給出新增部分的類型描述。

這里從模塊moduleA導(dǎo)入了Foo接口，將其重命名為Bar，并用 declare 關(guān)鍵字為Bar增加一個屬性custom

import { Foo as Bar } from 'moduleA';

declare module 'moduleA' {
  interface Bar extends Foo {
    custom: {
      prop1: string;
    }
  }
}

例子：一個項(xiàng)目有多個模塊，可以在一個模塊中，對另一個模塊的接口進(jìn)行類型擴(kuò)展。

這里腳本a.ts定義了一個接口A，腳本b.ts為這個接口添加了屬性y。declare module './a' {}表示對a.ts里面的模塊，進(jìn)行類型聲明，而同名 interface 會自動合并，所以等同于擴(kuò)展類型。實(shí)質(zhì)是新增了一個同名的接口，因?yàn)槭峭麜詣雍喜ⅰ?/strong>

// a.ts
export interface A {
  x: number;
}

// b.ts
import { A } from './a';

declare module './a' {
  interface A {
    y: number;
  }
}

const a:A = { x: 0, y: 0 };

declare module "模塊名";

// 例子
declare module "hot-new-module";

declare module 'my-plugin-*' {
  interface PluginOptions {
    enabled: boolean;
    priority: number;
  }

  function initialize(options: PluginOptions): void;
  export = initialize;
}

export {};
declare global {
  interface String {
    toSmallString(): string;
  }
}
String.prototype.toSmallString = ():string => {
  // 具體實(shí)現(xiàn)
  return '';
};

declare enum E1 {
  A,
  B,
}
declare enum E2 {
  A = 0,
  B = 1,
}
declare const enum E3 {
  A,
  B,
}
declare const enum E4 {
  A = 0,
  B = 1,
}

// node.d.ts
declare module "url" {
  export interface Url {
    protocol?: string;
    hostname?: string;
    pathname?: string;
  }
  export function parse(
    urlStr: string,
    parseQueryString?,
    slashesDenoteHost?
  ): Url;
}
declare module "path" {
  export function normalize(p: string): string;
  export function join(...paths: any[]): string;
  export var sep: string;
}

/// <reference path="node.d.ts"/>