TypeScript，初次见面，请多指教 ?

摘要： TS入门手册。

• 原文：TypeScript，初次见面，请多指教
• 作者：徐祁

Fundebug经授权转载，版权归原作者所有。

为什么用 TS ?

说实话，最开始并没有想把 TS 用到实际项目中来，一来是感觉“类型”会限制 JS 的优势（好吧，就是浪写浪惯了）；二来听闻 TS + Redux 的酸爽滋味，有点望而却步；三来 TS 环境使用的库需要加类型的声明，很多库并不支持，有点担心推进的流畅度 ...

这个时候，就需要有一股无形的力量推你一把。推我的是团队正在日益普及 TS, 我希望推动你的可以是这篇文章 ~

接下来，会有 React + TS 的项目为背景，介绍我在初学 TS 开发项目中遇到的一些问题，希望对你有所帮助。

一. 如何优雅的声明类型

1. 基础

不就是比 JS 多了一个类型声明吗？老夫撸起袖子拎起键盘就是一梭子：

interface Basic {
  num: number;
  str: string | null;
  bol?: boolean;
}

轻轻松松，五种 JS 值类型就声明好了。那数组、函数呢？再来：

interface Func {
  func(str: string): void;
}

interface Arr {
  str: string[];
  mixed: Array<string | number>;
  fixedStructure: [string, number];
  basics: Basic[];
}

除此之外，竟然还可以定义自己的类型呢，比如常用的回调函数，在声明处需要指定回调函数的类型：

event.on('change', function() {});

那这个 on 方法需要如何声明呢？试试看 Function当 cb 函数的类型呢

on(type: string, cb: Function): {}

然后就恭喜了，你会得到一个 tslint error :

庆幸的是，在这个 error 里面它告诉了你应该怎么做：声明一个专用的函数类型就可以了：

type Cb = () => void;

on(type: string, cb: Cb);

至此，我们的 TS 人生算是起步了