这是我参与「第四届青训营」笔记创作活动的第9天

JS与TS

TypeScript为JavaScript的超集，支持ES6的写法
TypeScript的数据要求带有明确的类型，JavaScript不要求，即TypeScript为静态类型，JavaScript为动态类型。
TypeScript增加了接口，类，模块，和类型注解
TypeScript 通过类型注解提供编译时的静态类型检查。

接口

接口是一系列抽象对象的声明，是一些方法特征的集合，需要由具体的类去实现，然后就可以通过这组抽象方法的调用，让具体的类执行具体的方法

//定义：
interface interface_name{

}

例如：

interface Persons {
    id : number,
    name : string,
    sayHi : () => string
}
var person : Persons = {
    id : 10,
    name : "Vicky"
    sayHi : () : string => { return "hello" }
}

通过定义接口Persons,接着定义变量person，使它的数据类型为Persons，person实现了接口Persons的属性和方法.

//接口继承
interface interface_name extends super_name1,super_name2 {

}

TyperScript允许接口继承多个接口，接口继承是通过extends关键字，继承的各个接口用“,”相隔，例如：

interface Persons {
    id : number,
    name : string,
    sayHi : () => string
}

interface People extends Person {
    sex : string
}

var person : People = {
    id : 10,
    name : "Vicky",
    sex : "female"
    sayHi : () : string => { return "hello" }
}

接口People通过继承Persons接口来扩展自己的属性，定义变量person，使它的类型为People,它既可以实现接口People的属性和方法，还可以实现Persons的属性和方法。

类

TypeScript使面向对象的JavaScript，类描述了所创建对象的属性和方法。

//定义：
class class_name {

}

类的数据成员可以有：

字段：类里面包含的变量，表示对象的有关数据
构造函数：类实例化时调用，可以为类的对象分配内存
方法：对象要执行的操作

例如：

class Car {
    //字段
    engine:string;
    
    //构造函数
    constructor( engine:string ){
        this.engine = engine;
    }
    
    //方法
    disp():void {
        console.log(this.engine);
    }
}

//创建对象
var obj = new Car('XXSY1');
console.log('发动机型号：' + obj.engine);//访问字段
obj.disp();//访问方法

上述代码会输出：

发动机型号：XXSY1
XXSY1

上述代码定义一个变量并用new创建一个Car对象，就可以调用类中的方法disp与字段engine

类的继承

类的继承也是通过extends关键字进行继承，在创建类的时候继承已知的类，则已知的类称为父类，继承它的类叫做子类

子类不能继承父类的私有属性和构造函数，其他的都可以继承

一次只能继承一个类，不支持继承多个类,但可以多重继承（即A继承B，B继承C）

子类继承父类后，子类可以对父类的方法进行重新定义，这个过程称为方法的重写

例如：

class Shape {
    area : number;
    
    constructor( area:number ){
        this.area = area;
    }
    
    disp():void {
        console.log('hello');
    }
}

class Circle extends Shape{
    disp():void {//重新定义方法
        super.disp();
        console.log('area : ' + this.area);//调用父类字段
    }
}
var obj = new Circle(100);
obj.disp();

输出：

hello
area : 100

上述例子通过Circle类继承Shape类，重写Shape类中的disp方法，并调用Shape父类中的area字段进行输出

若类中的数据成员为static定义，则表示为数据成员为静态的，可以直接通过类名调用。

例如：

class Shape {
  static area:number
  static disp():void {
      console.log(Shape.number);
  }
}
Shape.number = 10;
Shape.disp()  //10

类与接口

类可以实现接口，使用关键字implements。

例如：

interface ILoan { 
    interest:number 
} 

class AgriLoan implements ILoan { 
    interest:number
    rebate:number
    
    constructor(interest:number,rebate:number) { 
        this.interest = interest; 
        this.rebate = rebate; 
   } 
} 

var obj = new AgriLoan(10,1); 
console.log("利润为 : "+obj.interest+"，抽成为 : "+obj.rebate );

输出为：

利润为 : 10，抽成为 : 1

上述代码AgriLoan实现接口ILoan,并将interest字段作为类的属性使用。

一些TypeScript基础知识 | 青训营笔记

JS与TS

接口

类