TypeScript学习笔记

写在前边

• 通过npm安装typescript，在根目录下执行命令ts init，或运行>任务>执行ts构建会生成一个tsconfig.json的文件，执行ts监视任务会在ts文件保存时自动编译生成对应的es5 js文件（需要主意其中的outDir属性）
• ts中可以使用es6的语法
• 变量定义
• 普通变量

  let name:type=value;
  

• 函数定义
  ts中定义函数，需要指定函数的返回类型以及参数的类型，如果返回值为空，指定类型为void

  function func(name:string,age:number):string{
    return name+age;
  }
  function func(stu:{name:string,age:number}):string{
    return stu.name+stu.age;
  }
  

  可选参数：在ts中可选参数以?代替

  function func(name:string,age?:number):string{//调用的时候就可以不传age参数
    return name+age;
  }
  

  参数默认值

  function func(name:string,age:number=20):string{//调用的时候不传age参数，age默认为20
    return name+age;
  }
  

  剩余参数：使用rest运算符...，将所有参数放在一个数组中

  function sum(...params:number[]):number{
  //遍历params，进行加法操作
  }
  sum(1,2,3,4,5,6,7,8,9);
  

  函数重载：ts 的重载是为了给调用者看，方便调用者知道该怎么调用，具体的函数实现逻辑是在一个方法中，其他的重载只是类似接口一样，定义方法的约束

  function fun(name:string):number;
  function fun(age:number):string;
  function fun(value:any):any{
    if(typeof value === 'number'){
      return "kerry";
    }
    else{
      return 20;
    }
  }
  

数据类型

• 数据类型

  ts中为了是代码编写规范、易于维护，增加了数据类型校验，变量的定义必须指定类型
  变量的定义方式：var a:boolean=true
  • 布尔类型（boolean）
  • 数值类型（number）
  • 字符串类型（string）
  • 数组类型（Array）

    数组类型有两种定义方式
    1.let arr:number=[1,2,3];//定义要给元数据为number的数组
    2.let arr:Array=[1,2,3];
  

  • 元组类型（tuple）

  也属于一种数组，只是元组中的元数据可以为不同的类型
  let arr:[number,string]=[123,'this is tuple'];
  //也可以简单的将其定义成一个any类型的数组
  let arr:Array
  

  • 枚举类型（enum）
    枚举类型的定义，通常如果不赋值，则为其实际值为其之前赋值的某个枚举标识累加的值（第一个表示值默认为0）

  enum httpStatus{
    fail=0,
    success=1,
    unknown=2,
    other
  }
  let stu:httpStatus=httpStatus.other;
  

  • 任意类型（any）
  • undefined和null
    其他类型的子类型

  var num:number;
  number=undefined;//错误，因为num是number类型
  console.log(num);//错误，在赋值前使用了变量num
  var num:number|undefined;//正确，变量num是number或undefined类型
  

  • void类型
    一般用于定义没有返回值的方法

  function func():void{
  }
  

  • 其他类型（never）
    通常意味着不会出现的值

  let a:never=(()=>throw Error(''))()
  

类

• 类的定义

class Person{
  name:string;//类的属性  缺省为public的
  protected sex:boolean;//类的保护属性
  private age:number;//类的私有属性
  constructor(n:string){//构造函数
    this.name=n;
  }
  run():void{//类的方法
    console.log(this.name);
  }
}

• 类的继承

class Student extends Person{
  static friends:Array //静态属性
  constructor(name:string){
    super(name);
  }
  static run():void{
    console.log("run");//静态方法
  }
}
var s:Student=new Student("学生");
s.run();
Student.friends=["AA","BB"];

• 类的抽象

有抽象类、抽象方法，抽象类是提供其他类继承的基类，不能被实例化。用abstract定义抽象类抽象方法，抽象方法不能包含具体实现，抽象方法只能定义在抽象类里
抽象类定义的抽象方法，派生类必须得实现

abstract class Animal {
      protected name:string;
      constructor(name:string) {
        this.name=name;
      }
      abstract run():void;
    }

    class Dog extends Animal{
      constructor(){
        super("dog");
      }
      run():void{//必须对抽象基类中的方法进行实现
        console.log("run");
      }
    }

• 接口

• 属性接口
  对一系列方法的传入参数进行约束，例如需要方法printStudent，需要传入一个对象，对象必须包含string类型的name、nmber类型的age、boolean类型的sex，以及数组类型的可选属性friends

  interface Student{
    name:string;
    age:number;
    sex:boolean;
    friends?:Array;
  }
  function printStudent(stu:Student){
  }
  printStudent("zhangsan")//错误
  printStudent({name:"zhangsan",age:12,sex:true});//正确