TypeScript 声明文件原理


本文整理自网络,侵删。

TypeScript声明文件原理

声明文件原理:深入探究

组织模块以提供你想要的API形式保持一致是比较难的。 比如,你可能想要这样一个模块,可以用或不用 new来创建不同的类型, 在不同层级上暴露出不同的命名类型, 且模块对象上还带有一些属性。

阅读这篇指定后,你就会了解如果书写复杂的暴露出友好API的声明文件。 这篇指定针对于模块(UMD)库,因为它们的选择具有更高的可变性。

核心概念

如果你理解了一些关于TypeScript是如何工作的核心概念, 那么你就能够为任何结构书写声明文件。

类型

如果你正在阅读这篇指南,你可能已经大概了解TypeScript里的类型指是什么。 明确一下, 类型通过以下方式引入:

  • 类型别名声明(type sn = number | string;
  • 接口声明(interface I { x: number[]; }
  • 类声明(class C { }
  • 枚举声明(enum E { A, B, C }
  • 指向某个类型的import声明

以上每种声明形式都会创建一个新的类型名称。

与类型相比,你可能已经理解了什么是值。 值是运行时名字,可以在表达式里引用。 比如 let x = 5;创建一个名为x的值。

同样,以下方式能够创建值:

  • letconst,和var声明
  • 包含值的namespacemodule声明
  • enum声明
  • class声明
  • 指向值的import声明
  • function声明

命名空间

类型可以存在于命名空间里。 比如,有这样的声明 let x: A.B.C, 我们就认为 C类型来自A.B命名空间。

这个区别虽细微但很重要 -- 这里,A.B不是必需的类型或值。

简单的组合:一个名字,多种意义

一个给定的名字A,我们可以找出三种不同的意义:一个类型,一个值或一个命名空间。 要如何去解析这个名字要看它所在的上下文是怎样的。 比如,在声明 let m: A.A = A;, A首先被当做命名空间,然后做为类型名,最后是值。 这些意义最终可能会指向完全不同的声明!

这看上去另人迷惑,但是只要我们不过度的重载这还是很方便的。 下面让我们来看看一些有用的组合行为。

内置组合

眼尖的读者可能会注意到,比如,class同时出现在类型列表里。 class C { }声明创建了两个东西: 类型C指向类的实例结构, C指向类构造函数。 枚举声明拥有相似的行为。

用户组合

假设我们写了模块文件foo.d.ts:

export var SomeVar: { a: SomeType };
export interface SomeType {
  count: number;
}

这样使用它:

import * as foo from './foo';
let x: foo.SomeType = foo.SomeVar.a;
console.log(x.count);

这可以很好地工作,但是我们知道SomeTypeSomeVar很相关 因此我们想让他们有相同的名字。 我们可以使用组合通过相同的名字 Bar表示这两种不同的对象(值和对象):

export var Bar: { a: Bar };
export interface Bar {
  count: number;
}

这提供了解构使用的机会:

import { Bar } from './foo';
let x: Bar = Bar.a;
console.log(x.count);

再次地,这里我们使用Bar做为类型和值。 注意我们没有声明 Bar值为Bar类型 -- 它们是独立的。

高级组合

有一些声明能够通过多个声明组合。 比如, class C { }interface C { }可以同时存在并且都可以做为C类型的属性。

阅读剩余部分

相关阅读 >>

分享angular中关于表单的一些知识点

简单对比,看看typescript中interface和type间的区别

typescript入门指南

typescript 2.0介绍

了解typescript和javascript之间的差异

typescript 声明文件介绍

在react中使用svg的各种方法总结(附代码)

url完整结构以及同源跨域处理的介绍

typescript 命名空间

typescript 基础类型

更多相关阅读请进入《typescript》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...