ts 快速入门

前言：请先熟悉ES6，包括其中的import、export、class等。ts特性右转百度，只讨论入门语法，语法方面基本就是c++/java等静态类型的语法简化版，而且兼容js语法，有学过这些的话光速入门。

---

变量

1.let x: number = 6
其中:number说明x是一个number类型。也可以简写成let x = 6，typescript会自动推断这些简单类型

2.let list: number[] = [1, 2, 3]
表明list是一个数组，数组内的元素只能是number类型。也可写成let list: Array = [1, 2, 3]，这是typescript中泛型的写法，等价的。下面的几点均是对类型的进一步说明

3.any代表任何类型，即跳过静态检查。如let x:any，那么就跟js中let x效果一模一样，ts不会对其进行检查。

4.void用于没有返回值的函数。一个函数返回类型为void时，只要使用了返回值就会报错，而上面的any不会。

5.null,undefined可以赋值给任意类型的变量。(没有使用--strictNullChecks时)

6.let a: number|string|object联合类型。代表a既可以是number，也可以是string或object类型

7.接口、类均可作变量的类型声明，但接口名可和变量重名，而类不行。

注：Number,Object等不要number这些类型“关键字”混作一谈，后面会作详解

---

函数

function add(x: number, y: number): number {
    return x + y;
}
let myAdd = function(x: number, y?: number): number { return x; };
let myAdd = function(x: number, y: number = 12): number { return x + y; };

函数的参数类似变量声明，:number加到后面即可规定参数类型。函数的括号()加上:number即可规定返回类型。
其中参数的后?代表该参数可选；给参数赋值y: number = 12代表参数默认取12。即“可选参数”和“默认参数”，效果和需要注意的细则右转百度

---

接口

ts的接口与java等语言的不同，ts的接口只是用来规定对象、函数、类的“形状”。

规定对象形状

interface Example {
  a: string;
  b?: number;
  readonly c: boolean;
}

let x: Example  = {a:"123", c:true};//正确
x.c=false;//错误，c为只读属性
x = { a: "123", b:12, c: false };//正确
x = { a: "123", b:12, d:12};//两个错误，缺少c属性、不应该具有d属性

如上面中，变量x一定有a、c属性，可能有b属性，其中对c属性只能读不能改。

interface Example {
  [propName: string]: number;
}
let x: Example;
x.a=1;//正确
x.b=2;//正确
x.c="123";//错误

这样的接口表示对象可以有若干个“key类型为字符串、value类型为number”的属性。
另一种可能情况是[propName: number]: number;，他表明你可以像x[0]=0;x[1]=1这样使用。
且必须注意:

interface Example {
  [propName: string]: number;
  a:string;
}

这样会报错。如上面解释，[propName: string]: number;规定x.a是number类型，而a:string;规定x.a是string类型，产生二义性导致报错。
一个简单解决方式是改为[propName: string]: any;，使其兼容(string是any的子类)，详细可右转文档

规定函数形状

interface Example1 {
  (a: number): boolean;
  (a: number, b: number): boolean;
  new (a: number, b: number): boolean;
  a:number;
}
let m1: Example1, temp:any;
temp = function (a,b) {return true;}
temp.a=123;
m1 = temp;
let a = m1(1), b = m1(1, 2), c = new m1(1, 2); 

interface Example2{
  (a: number): boolean;
}
let m2: Example2 = function (a: number): boolean { return true; }

一个接口可以定义函数的多种形状，如上面的Example1接口。
当接口如Example2只规定了一种形状时，变量m2直接赋值成这种类型的函数就行了。
当接口如Example1规定了多种形状时，变量m1无法直接简单赋值，此时需要搞个any类型的变量temp，js怎么做的这个temp就怎么做，最后赋值给变量m1。

注意：
1.接口名可以和变量重名，即let Example1:Example1;是可行的。同理，在typescript中，Number、String这些，既是接口也是变量。建议去typescript官方库看下Number具体是什么一回事。
2.接口可在不同地方重复定义，后面重复定义的接口内容将会被合并原有接口。简单来说就是接口具有灵活的扩展性，你不必在一处地方完全定义一个接口，也可以自行对原有接口进行补充。

---

类

写法跟js的class几乎一样，下面简要概括

class A {
    a: string;
    protected c: string;
    constructor(a: string, public b: string) {
        this.a= a;
    }
    m():string {
      return this.a + this.b;
    }
    static mm():number { return 0; }
}
let x = new A("1","2");

类成员a直接写在里面，访问级别默认是public，变量和函数同样遵从上面讲过的写法。

其特点：
1.构造函数里面的参数public b: string：当你在构造函数的参数b前面加上public、protected、private中任意一个，就代表声明了一个成员变量b，且把参数b的值赋给它。简单来说，就是一种对成员变量定义+构造函数中初始化的简写形式。
2.像java一样，类可以单继承(extends)一个类，实现(implements)多个接口；接口可以继承多个接口。比较奇葩的是接口同样可以继承多个类(interface B extends A{})，不过建议尽量别这样用。
3.类实现接口，仅代表类的实例部分被接口所约束，即类中必须重新声明定义接口中出现的方法和成员。这表明我们无法直接通过接口，规定其实现类的static修饰的成员、函数以及构造函数(constructor)。深入了解还请右转文档

---

命名空间

即namespace，作用类似与js的import/export。用的比较少，我就大概说说了。

import/export大家都熟了，就是一个js一个模块，另外一个文件可以通过import，导入export导出的变量和成员。这个的稍微不足之处是限死了一个模块只能在一个js文件里，不过我们也能通过额外写个js模块负责总的导入导出，其实也还行。
而typescript中的namespace，同样可以看作是模块化，不过除去了上述限制。你可以在一个ts文件里写多个namespace，也可以把一个namespace分散在若干个ts文件中，更加灵活。

namespace ns {
  const a = 1;
  let b = 1;
  export const c = a + b;
  export class A { }
}
let x = ns.c, xx = new ns.A();

可以看作是

//f1.js
const a = 1;
let b = 1;
export const c = a + b;
export class A { }

//f2.js
import * as ns from './f1.js'
let x = ns.c, xx = new ns.A();

当然只是个大概示意，为了说明namespace拿来干什么用，不要忘记其特性。
注意：需要通过特殊注释来发现另一个文件中的namespace，如/// 这种形式，而且有顺序先后的影响。深入了解请右转文档

---

声明文件

即d.ts后缀那些ts文件。如果是全项目都用ts的，那么没什么问题；但如果你是js、ts混杂的，ts中无法识别js中的东西，这就需要我们去为这些js中的对象、函数、类等写一份ts格式的声明，否则ts中大量报错未定义、类型不对等等东西。

介绍两个关键字type和declare：
(1)type跟c++的type差不多，用于类型别名，包括联合类型，如type NumStr=number|string

(2)declare基本上专门用于声明文件，被其修饰的变量/函数/类的成员和函数均无法被初始化赋值。
当然你要用在普通ts文件、或者声明文件不用它也是可以的，只是某些情况下你必须使用，如declare const XXX;，如果不加上declare，ts会报错常量未初始化，但实际上这个是来自js的常量，你不能在ts中重复初始化，否则编译为js后实际运行时就会报错。
另外一个要点是declare namespace X{}来修饰命名空间X时，等价于用export declare来修饰其内部的每一个变量:

//a.js
var X={a:1,b:2,c:3}
export X;

//a.d.ts
//方式1
declare namespace X {
  var a: number;
  var b: number;
  var c: number;
}
//方式2
namespace X {
  export declare var a: number;
  export declare var b: number;
  export declare var c: number;
}
//方式3
interface X{
  a: number;
  b: number;
  c: number;
// ():number;
}
declare var X: X;

注意：声明一个对象不一定要用namespace实现，也可通过接口+声明一个对象来实现，副作用是多了一个基本无作用的接口，如方式3。但是，假如X是一个函数对象，即X能以let a=X()函数调用时，你基本上只能靠接口实现(你用any来搞也行)，如方式3的注释