工具和基础

TypeScript是js的超集。

在使用时，需要将ts转为js运行。需要安装解析typescript的工具包

npm install typescript -g 

该库提供了一个命令，你可以使用tsc 1.ts来编译ts文件，生成一个js文件，之后在运行js文件。这是非常繁琐的。

ts-node可以将该步骤节省1步，即编译并运行文件。

npm install ts-node --save
// 使用
ts-node 1.ts

ts提供了很多类型可供选择

布尔型:boolean
数字型:number
字符串:string
元组:tuple
数组:array
枚举:enum
任意:any
null , undefined
void类型
never类型


// 除此外你还可以自定义类型
interface ok { // 自定义ok类型
  x: number,
  y: string
}
// 则ok类型，必须带有x,y
const z: ok = {x: 15, y: 'a'};

类型注解和类型推断

// type annotation 类型注解，我们来告诉TS变量是什么类型
// type inference 类型推断: TS自动尝试分析变量的类型
// 如果TS能自动分析变量类型，我们就什么也不需要做了
// 如果TS无法分析变量类型的话，就需要使用类型注解

// 类型注解
let count: number;
count = 123;

// 类型推断,鼠标放上去，会自动显示类型
let countInference = 123;

// 需要接类型注解
function getTotal (a: number, b: number) {
  return a + b;
}

函数相关类型

function add (first: number, second: number): number {
  return first + second;
}

// void 没有返回值
function sayHello (): void {
  console.log('hello')
}

// never 此函数永远无法执行到最后
function errorEmitter (): never {
  throw new Error('error');
  console.log('end');
  // 或者
  // while(true) {}
}

// 参数解构时的类型注解
function add2 (
  {first, second}: {first: number, second: number}
): number {
  return first + second;
}
const total = add2({first: 1, second: 2})

基础类型

// 基础类型,boolean,number,string,void,undefined,sysbol,null
let count: number;
count = 123;

// 对象类型, {}, Class, function, []
const func = (str: string) => {
  return parseInt(str, 10);
};
// 或者
const func1: (str: string) => number = (str) => {
  return parseInt(str, 10);
};

const date = new Date();
// 其他case
interface Person {
  name: 'string'
}
const rawData = '{"name": "abc"}';
const newData: Person = JSON.parse(rawData);

数组和元组

const numArr: number[] = [1,2,3];
const arr: (number | string)[] = [1,'s', 5]; // 即可为数字，也可字符串
const strArr: string[] = ['a', 'b'];

// 类型别名 type alias
type User = {name: string, age: number}

const objArr : User[] = [
  {name: 'a', age: 10}
]; // 内部对象必须都是包含name的对象，如果包含其他字段，也报错

class Teacher {
  name: string;
  age: number;
};

const objArr2: Teacher[] = [
  new Teacher(),
  {name: 'b', age: 30}
];

// 元组
const tInfo: [string, string, number] = ['a', 'b', 55]; // 严格匹配
// csv
const list: [string, string, number][] = [
  ['a', 'b', 88],
  ['c', 'd', 99]
];

interface

- interface 与 类型别名类似，但是又存在区别
- interface可以继承
- 类可以应用接口(interface)
- 编译成js时，不会包含接口，只是开发时的校验工具

interface Person2 {
  name:string;
  age?: number; // 加上？表示可有可无
  // readonly name: string readonly 可有可无
  [propName: string]: any; // 可以传入其他属性
  say(): string; // 可以有方法
}

// 也可以继承
interface Teacher extends Person2 {
  teach(): string;
}

// 可以定义函数类型
interface SayHi {
  (word: string): string
}

const say: SayHi = (word: string) => {
  return word;
}

const getPersonName = (person: Person2) => {
  console.log(person.name);
}

const setPersonName = (person: Person2, name: string) => {
  person.name = name;
};

const person = {
  name: 'aaa',
  say () {
    return '66';
  }
}
// 直接传入person，不报错
getPersonName(person);

// 传入字变量，报错
// 强校验
// getPersonName({
//   name: 'sss',
//   sex: 'male'
// });

setPersonName(person, 'dd');

// 类应用接口
class User implements Person2 {
  name = 'aa';
  say () {
    return '55';
  }
}

类的静态属性，getter，setter

// getter setter
class Person4 {
  // 私有属性
  constructor(private _name: string) {}
  // 获取私有属性
  get name () {
    return this._name;
  }
  set name (name: string) {
    const realName = name.split(' ')[0];
    this._name = realName;
  }
}

const person4 = new Person4('55');
console.log(person4.name);
person4.name = '66';
console.log(person4.name);

// 单例模式
class Demo {
  private static instance: Demo;
  private constructor() {  
  }
  // static 将实例方法挂载在类上，而非实例上
  static getInstance () {
    if (!this.instance) {
      this.instance = new Demo();
    }
    return this.instance;
  }
}

const demo1 = Demo.getInstance();
const demo2 = Demo.getInstance();

抽象类

class Person5 {
  // readonly 只读
  public readonly name: string;
  constructor (name: string) {}
}
const p = new Person5('ooo');
console.log(p.name);

// 抽象类,只能继承，不能实例
// 很多类存在相同的方法,其实就是一个含有规则的模子
// 你要做东西，必须按照我的模子来做，否则你做的就不对，不规范

abstract class Geom {
  getType () {
    return '66';
  }
  // 抽象方法
  abstract getArea (): number; // 需要getArea，但是实现的方式都不同
}

class Cirtle {
}