Typescript中的类

598 阅读3分钟

小知识,大挑战!本文正在参与“程序员必备小知识”创作活动

ts中定义类跟es6的类非常类似。

es6中定义类用class关键,ts也是一样

语法 class 类名 {}

构造函数

通过constructor定义构造函数

构造函数的参数必须要指明类型

如果参数可有可无,要加上?

注意:构造函数不要设置返回值类型(是唯一一个不需要设置返回值类型的)

属性

在ts中,属性数据要在类体中声明(声明类型),如果没有设置类型,ts会做类型猜测

为属性赋值有两种方式

第一种,直接在类体中,声明的时候赋值。

第二种,在构造函数中,为属性赋值(也要在类体中,声明属性名称)

我们可以使用构造函数的参数数据,为属性赋值,此时就实现了数据由外部,例如类的内部

注意:此时参数的类型必须与属性的类型一致

注意:声明的属性,如果没有赋值,编译的时候,会删除

方法

定义方法的语法跟es6一致,只不过要声明类型

语法: demo(arg?:type):type {}

我们要定义参数的类型

我们要定义返回值的类型(没有返回值写void)

如果参数可有可无,可以添加?

编译的时候,会将方法添加在原型上

关键字

ts是强类型的语言,提供了面向对象的关键字,如static,public,private,protected等

但是ts最终要编译成js,在js中,模拟public,private,protected等功能成本很高,或者无法实现,因此我们定义的时候,可以忽略这些关键字(后面一些框架中,会利用这些关键字实现一些语法糖)。

但是static定义静态属性和静态方法的,因此js可以实现(为类,用点语法添加属性和方法)。

当我们使用了static关键字,该属性或者该方法,将在实例化对象中移除,添加在类上了,访问他们要通过类。

es6可以在类的外部添加静态属性和静态方法,但是在ts中不允许,在外部添加(修改),必须要在内部声明。

实例化

实例化类的时候,会出现变量,该变量的类型就是类

ts中的类是一个闭包类

举例:

// 定义类
export class Book {
    // 由于public,private,protected对编译没有影响,因此开发中可以省略他们。
    // 声明属性
    public title:string;
    static writer:string = 'Mr Zhang';
    private page:number;
    // 类型猜测
    protected color;
    // 如果生命的属性(包括在构造函数中)没有被赋值,编译的时候会删除
    num;
    // 在外部添加的静态属性,要在类的内部声明
    static id;
    // 构造函数中
    constructor(title:string, page?:number) {
        // 用参数为属性赋值,此时类型必须一致
        this.title = title;
        // 构造函数内,为属性赋值,该属性要在类体中声明
        this.color = '#fff';
        this.page = page;
    }
    // 定义方法
    static getWriter():string {
        return this.writer
    }
    // 获取标题
    public getTitle():string {
        return this.title;
    }
    // 获取页码
    private getPage():number {
        return this.page;
    }
    // 获取颜色
    protected getColor():string {
        return this.color;
    }
}
// 不允许直接在外部添加属性
Book.id = 10;
// 实例化
// var b:Book = new Book('JavaScript设计模式')
// console.log(b)
// console.log(Book.writer)
// console.log(Book.getWriter())