TypeScript结构化类型初探

啥是鸭子类型？

作为一个前端程序员，想必大家都知道javascript是一个弱类型语言，如果需要类型的支持，那就需要借助typescript来实现，但是大家可曾听过这样一个说法？

javascript属于鸭子类型

当我第一次看到这个说法时，我不禁哈哈大笑，鸭子类型是啥？其实这不过是一个比喻而已，鸭子类型的意思是：

如果一个动物看起来像鸭子，游起泳来像鸭子，叫起来也像鸭子，那么它大概率就是鸭子。

结构化类型

TypeScript使用结构化类型（Structural Typing）来实现javascript中的鸭子类型，结构化类型描述的是两个类型之间的兼容性，我们看一个具体的例子，再下结论。
假设你正在开发一个3D图形应用程序，这个程序最基本的功能就是绘制图形，而绘制图形最基本的数据结构就是点，我们先定义一个2D点。

1. interface Point2D {
2.   x: number;
3.   y: number;
4. }

复制代码

当然，要绘制3D图形，我们还需要一个3D点。

1. interface Point3D {
2.   x: number;
3.   y: number;
4.   z: number;
5. }

复制代码

现在我们可以下结论了，Point3D与Point2D是兼容的，因为Point3D包含了所有Point2D的属性。
所以结构化类型的定义如下：

如果一个类型B包含了另一个类型A的所有属性，那么这两个类型是兼容的，我们可以将类型B赋值给类型A。

需要注意的是，这种兼容性是单向的，Point3D可以赋值给Point2D，但反之不行，因为Point2D缺少了z属性。
其实这不难理解，假设我们要绘制一条2D线段，需要两个点来表示这条线段的起点和终点。

1. function drawLine(start: Point2D, end: Point2D) {
2.   // 绘制线段的逻辑
3. }

复制代码

那么如果我们传入的是Point3D类型的点，程序依然可以正常工作，因为Point3D包含了Point2D的所有属性。多出来的z属性直接忽略，并不影响结果。

1. const start: Point3D = { x: 0, y: 0, z: 0 };
2. const end: Point3D = { x: 1, y: 1, z: 1 };
3. drawLine(start, end); // 依然可以正常绘制线段

复制代码

我们甚至不需要传递一个Point3D类型的点，任意一个包含x和y属性的对象都可以作为参数传递给drawLine函数。

1. const start = { x: 0, y: 0 };
2. const end = { x: 1, y: 1 };
3. drawLine(start, end); // 依然可以正常绘制线段

复制代码

这就是结构化类型的威力，也是JavaScript的灵活性所在。
名义类型

与结构化类型对应的是名义类型（Nominal Typing），比如Java和C#这种强类型语言，使用的都是名义类型，名义类型要求类型的名称必须匹配才能兼容。也就是说，只有当两个类型的名称完全相同或者存在继承关系时，它们才被认为是兼容的。
对于Java或者C#这样的强类型语言来说，上面drawLine的例子就不成立了，因为Point2D和Point3D是两个不同的类型，即使它们有相同的属性，也不能互相替换。

1. class Point2D {
2.     int x;
3.     int y;
4. }
6. class Point3D {
7.     int x;
8.     int y;
9.     int z;
10. }
12. void drawLine(Point2D start, Point2D end) {
13.     // 绘制线段的逻辑
14. }
16. Point3D start = new Point3D(); // 定义起点
17. Point3D end = new Point3D(); // 定义终点
18. drawLine(start, end); // 编译错误，Point3D不是Point2D类型

复制代码

基于这个原因，在强类型语言中如果要实现类型兼容性的话，只能通过继承来实现。

1. class Point2D {
2.     int x;
3.     int y;
4. }
6. class Point3D extends Point2D {
7.     int z;
8. }
10. void drawLine(Point2D start, Point2D end) {
11.     // 绘制线段的逻辑
12. }
14. Point3D start = new Point3D(); // 定义起点
15. Point3D end = new Point3D(); // 定义终点
16. drawLine(start, end); // 现在可以正常工作

复制代码

上面的例子中，Point3D继承自Point2D，这就意味着Point3D是一个Point2D类型的对象，可以在需要Point2D的地方使用。
出处：http://www.cnblogs.com/graphics/本文版权归作者和博客园共有，欢迎转载，但未经作者同意必须保留此段声明，且在文章页面明显位置给出原文连接，否则保留追究法律责任的权利.
来源：豆瓜网用户自行投稿发布，如果侵权，请联系站长删除