全局代码库

全局代码库可以通过全局作用域来访问（例如，不使用任何形式的import语句）。 许多代码库只是简单地导出一个或多个供使用的全局变量。 比如，如果你使用jQuery，那么可以使用$变量来引用它。

  1. $(() => {
  2.     console.log('hello!');
  3. });

你通常能够在文档里看到如何在 HTML 的 script 标签里引用代码库：

  1. <script src="http://a.great.cdn.for/someLib.js"></script>

目前，大多数流行的全局代码库都以 UMD 代码库发布。 UMD 代码库与全局代码库很难通过文档来识别。 在编写全局代码库的声明文件之前，确保代码库不是 UMD 代码库。

从代码来识别全局代码库

通常，全局代码库的代码十分简单。 一个全局的“Hello, world”代码库可以如下：

  1. function createGreeting(s) {
  2.     return 'Hello, ' + s;
  3. }

或者这样：

  1. window.createGreeting = function (s) {
  2.     return 'Hello, ' + s;
  3. };

在阅读全局代码库的代码时，你会看到：

  • 顶层的var语句或function声明
  • 一个或多个window.someName赋值语句
  • 假设 DOM 相关的原始值document或window存在

你不会看到：

  • 检查或使用了模块加载器，如require或define
  • CommonJS/Node.js 风格的导入语句，如var fs = require("fs");
  • define(...)调用
  • 描述require或导入代码库的文档

全局代码库的示例

由于将全局代码库转换为 UMD 代码库十分容易，因此很少有代码库仍然使用全局代码库风格。 然而，小型的代码库以及需要使用 DOM 的代码库仍然可以是全局的。

全局代码库模版

你可以看到如下声明文件的示例：

  1. // Type definitions for [~THE LIBRARY NAME~] [~OPTIONAL VERSION NUMBER~]
  2. // Project: [~THE PROJECT NAME~]
  3. // Definitions by: [~YOUR NAME~] <[~A URL FOR YOU~]>
  5. /*~ If this library is callable (e.g. can be invoked as myLib(3)),
  6.  *~ include those call signatures here.
  7.  *~ Otherwise, delete this section.
  8.  */
  9. declare function myLib(a: string): string;
  10. declare function myLib(a: number): number;
  12. /*~ If you want the name of this library to be a valid type name,
  13.  *~ you can do so here.
  14.  *~
  15.  *~ For example, this allows us to write 'var x: myLib';
  16.  *~ Be sure this actually makes sense! If it doesn't, just
  17.  *~ delete this declaration and add types inside the namespace below.
  18.  */
  19. interface myLib {
  20.     name: string;
  21.     length: number;
  22.     extras?: string[];
  23. }
  25. /*~ If your library has properties exposed on a global variable,
  26.  *~ place them here.
  27.  *~ You should also place types (interfaces and type alias) here.
  28.  */
  29. declare namespace myLib {
  30.     //~ We can write 'myLib.timeout = 50;'
  31.     let timeout: number;
  33.     //~ We can access 'myLib.version', but not change it
  34.     const version: string;
  36.     //~ There's some class we can create via 'let c = new myLib.Cat(42)'
  37.     //~ Or reference e.g. 'function f(c: myLib.Cat) { ... }
  38.     class Cat {
  39.         constructor(n: number);
  41.         //~ We can read 'c.age' from a 'Cat' instance
  42.         readonly age: number;
  44.         //~ We can invoke 'c.purr()' from a 'Cat' instance
  45.         purr(): void;
  46.     }
  48.     //~ We can declare a variable as
  49.     //~   'var s: myLib.CatSettings = { weight: 5, name: "Maru" };'
  50.     interface CatSettings {
  51.         weight: number;
  52.         name: string;
  53.         tailLength?: number;
  54.     }
  56.     //~ We can write 'const v: myLib.VetID = 42;'
  57.     //~  or 'const v: myLib.VetID = "bob";'
  58.     type VetID = string | number;
  60.     //~ We can invoke 'myLib.checkCat(c)' or 'myLib.checkCat(c, v);'
  61.     function checkCat(c: Cat, s?: VetID);
  62. }