TypeScript学习笔记(二)类、多态、抽象方法和抽象类

3,672 阅读3分钟

前言

TypeScript作为一门前端语言,其形式上更类似于后端java语言,相对于JavaScript而言TypeScript更体现出面向对象的编程方式,其提供的参数校验、接口、泛型等等,都使得ts在开发大型前端项目时有着出色的表现,因此作为一名前端开发人员,掌握ts语言是非常有必要的,这里博主将自己在学习TypeScript时,整理的一些基础知识笔记分享出来。 本章内容包括:TypeScript中类、多态、抽象方法和抽象类的基础知识

类的基础用法

TypeScript中类的基础用法一部分和JavaScript中ES6的类有些相似,这里先介绍这一部分

  1. 类的定义
//类的定义 通过class关键字
class Father{
    name:string//实例属性
    //构造函数
    constructor(name:string){
    	this.name = name
    }
    //实例方法
    run():string{
    	return `父亲${this,name}在跑步`
    }
}
//实例化一个父对象
const father1 = new Father("张三")
father1.run() //父亲张三在跑步
  1. 类的继承 通过继承 子类可以继承父类的 允许被继承访问的属性和方法,继承父类的构造方法
    // 继承需要使用extends关键字
    class Son extends Father{
        //除非子类中不写构造函数,否则构造函数内部必须要有super关键字
    	constructor(name:string){
        	//super会借用父类的构造方法
        	super(name)
        }
        //子类也可以重写父类的构造方法
        run():string{
        	return `儿子${this.name}在跑步`
        }
    }
    const son1 = new Son("小明")
    son1.run() //儿子小明在跑步

类的修饰符

  1. public 共有的 用 public 标示的方法和属性 在类的内部、类的外部、子类都可以进行访问

  2. protected 保护的 用 protected 标示的方法和属性 在类的内部和子类中都可以进行访问,但是类外部无法访问

  3. private 私有的 用 private 标示的方法和和属性 只能在类的内部访问,类的外部和子类都无法访问

	class Message{
    	public name:string //共有的 注意默认不写修饰符也是public
        protected date:string //保护的 
        private content:string = "我是一个私有的内容" //私有的
        constructor(name:string,date:string) {
   			this.name = name
            this.date = date
  		}
        getContent(){
        	return this.content //成功  "我是一个私有的内容" private修饰的类内部可以访问
        }
    }
    const message1 = new Message("新闻""12.12")
    message1.name //成功 "新闻"
    message.date //报错 date是被protected修饰的可以被类内部和子类访问
    message.content //报错 因为content是Message私有的 外部和子类都不能直接访问
    class Note extends Message{
    	constructor(name:string,date:string) {
			super(name,date)
  		}
        getContent(){
        	return this.content //报错 因为content是Message私有的 子类不能访问
        }
        getDate(){
        	return this.date //成功 date是被protected修饰的可以被类内部和子类访问
        }
        getName(){
        	return this.name //成功 name是public修饰的子类可以访问
        }        
    }

静态属性和静态方法

	class Message {
    	constructor(){
        }
        static status:string = "我是静态属性"//静态属性
        name:string//实例方法
        static changeStatus():void{
        	console.log(this.name)//报错 静态方法只能访问静态属性
            console.log(this.status)//成功 "我是静态属性"
        }
        call():void{
            console.log(this.status)//成功 "我是静态属性" 实例方法可以访问静态属性
        }
    }
    const message1 = new Message()
    //静态属性和方法的调用只能通过类名.的形式
    message1.status //失败 
    Message.changeStatus() //成功

多态

父类定义方法,但是不实现,让其子类去实现,每个子类都有不同的表现 多态属于继承

	class Animal{
    	name:string
        constructor(name:string){
        	this.name = name
        }
        eat():void{}
    }
	class Cat extends Animal{
    	name:string
        constructor(name:string){
        	super(name)
        }
        eat():void{
        	console.log("小猫吃饭的方法")
        }
    }    
	class Pig extends Animal{
    	name:string
        constructor(name:string){
        	super(name)
        }
        eat():void{
        	console.log("小猪吃饭的方法")
        }
    }  

抽象方法和抽象类

用 abstract 关键字定义抽象类和抽象方法,在抽象类中抽象方法不包含具体实现必须在派生类中实现
抽象方法和抽象类的使用有以下几个注意点

  1. 抽象类和抽象方法一般用来定义某种标准,可以用来实现多态
  2. 抽象类中可以有实例方法,但是必须包含一个抽象方法,否则没有意义
  3. 抽象方法只能存在于抽象类中
  4. 继承抽象类的子类,必须实现抽象类中定义的抽象方法
  5. 抽象类无法被实例化 下面我们依然用动物的案例来展示
	//抽象类
	abstract classs Animal{
    	public name:string
        constructor(name:string){
        	this.name = name
        }
        abstract eat():any //抽象方法
    }
    const animal = new Animal("动物") // 报错 抽象类无法被实例化
    //派生类去实现抽象类
    class Cat extends Animal{
    	constructor(name:string){
        	this.name = name
        }
        //子类必须去实现 继承抽象类的抽象方法 否则报错
        eat():any{
        	console.log("小猫的吃饭方法")
        }
        abstract fn():void{}//报错 抽象方法只能在抽象类中定义
    }