5.typeScript中的类

JS中继承的概念 ：通过 【 某种方式 】 让一个对象可以访问到另一个对象中的属性和方法，我们把这种方式称之为 继承

为什么要使用 继承：有些 对象会有方法 ( 动作、行为 ) ，而这些方法都是函数，如果把这些方法和函数都放在构造函数中声明就会导致内存的 浪费

类的定义

es5中定义类：

function Person(name){
	this.name=name;
	this.run=function(){//定义方法
		alert (this.name)
	}
}
var p=new Person('张三');
p.run()

Ts通过class关键字定义类：

class Person{
	name:string;   //定义属性：前面省略了public关键词	
	constructor(n:string){//构造函数，实例化类的时候触发的方法
		this.name=n; //接受实例化传过来的参数，等同于ES5中的this.name=name;
	}
	run():void{
		alert(this.name);
	}
}
var p=new Person('张三');
p.run()

ts中定义类：

class Person2{
	name:string; 
	constructor(name:string){  //构造函数，实例化类的时候触发的方法
		this.name=name;
	}
	//改变属性
	getName():string{
		return this.name;
	}
	//获取属性
	setName(name:string):void{
		this.name=name;
	}
}
var p2=new Person2('张三');
alert(p2.getName());
p2.setName('李四');
alert(p2.getName());

ts中实现继承：通过extends及super关键字实现

class Person{
    name:string;
    constructor(name:string){//构造函数接收实例化传过来的参数
        this.name=name;
    }
    run():string{
        return `${this.name}在运动`
    }
}
var p=new Person('王五');
alert(p.run())
// Web类继承person类
class Web extends Person{
    constructor(name:string){//构造函数
        super(name); /*初始化调用父类的构造函数*/
    }
}
var w=new Web('李四');
alert(w.run());

ts中继承的探讨：父类的方法和子类的方法一致时有相同方法时执行的是子类的方法：

class Web extends Person{
	// 继承父类的方法
    constructor(name:string){
        super(name);  /*初始化父类的构造函数*/
    }
	// 扩展自己的方法
    run():string{
        return `${this.name}在运动-子类`
    }
    work(){
        alert(`${this.name}在工作`)
    }
}
var w = new Web('李四');
alert(w.run());
w.work();

typeScript中的类里面的修饰符

• 类里面的修饰符  typescript里面定义属性的时候给我们提供了 三种修饰符
• public :公有----在当前类里面、 子类  、类外面都可以访问
• protected：保护类型---在当前类里面、子类里面可以访问 ，在类外部没法访问
• private ：私有---在当前类里面可以访问，子类、类外部都没法访问
• 属性如果不加修饰符 默认就是 公有 （public）

类外部访问公有属性

class Person{
	public name:string;  /*父类定义的公有属性*/
	constructor(name:string){
		this.name=name;
	}
	run():string{
		return `${this.name}在运动`
	}
}
class Web extends Person{
	constructor(name:string){
		super(name);  /*初始化父类的构造函数*/
	}
	work(){
		alert(`${this.name}在工作`)
	}
}
var w=new Web('李四');
w.work();

类外部访问公有属性

class Person{
	public name:string;  /*公有属性*/
	constructor(name:string){
		this.name=name;
	}
	run():string{
		return `${this.name}在运动`
	}
}
var  p=new Person('哈哈哈');
alert(p.name);

protected：保护类型：在类里面、子类里面可以访问 ，在类外部没法访问

class Person{
	protected name:string;  
	constructor(name:string){
		this.name=name;
	}
	run():string{
		return `${this.name}在运动`
	}
}
class Web extends Person{
    constructor(name:string){
        super(name);  /*初始化父类的构造函数*/
    }                  
    work(){
        alert(`${this.name}在工作`)
    }
}
var w=new Web('李四11');
w.work();//子类可以访问
alert( w.run());//类里可以访问

类外外部没法访问保护类型的属性

class Person{
    protected name:string;  /*保护类型*/
    constructor(name:string){
        this.name=name;
    }
    run():string{
        return `${this.name}在运动`
    }
}
var  p=new Person('哈哈哈');
alert(p.name);

private ：私有,在类里面可以访问，子类、类外部都没法访问

class Person{
    private name:string;  /*私有*/
    constructor(name:string){
        this.name=name;
    }
    run():string{
        return `${this.name}在运动`
    }
}

class Web extends Person{
    constructor(name:string){
        super(name)
    }
    work(){
        alert(`${this.name}在工作`)
    }
}

类外部没法访问私有类型的属性

class Person{
    private name:string;  /*私有*/
    constructor(name:string){
        this.name=name;
    }
    run():string{
        return `${this.name}在运动`
    }
}
var p=new Person('哈哈哈');
alert(p.name);

当前类中可以访问私有类型的属性

class Person{
    private name:string;  /*私有*/
    constructor(name:string){
        this.name=name;
    }
    run():string{
        return `${this.name}在运动`
    }
}
var p=new Person('哈哈哈');
alert(p.run());

typeScript中类的静态属性 静态方法

ES5中的静态属性 静态方法

function Person(){
	this.run1=function(){}//实例方法
}
Person.name = '哈哈哈';// 静态属性
Person.run2=function(){}// 静态方法
var p = new Person();
p.run1();//实例化Person后调用实例方法
Person.run2(); //通过类名.方法 直接调用静态方法
alert(Person.name)//静态属性的调用

ts中的静态属性 静态方法

class Per{
	public name:string;
	public age:number=20;
	//静态属性
	static sex="男";
	constructor(name:string) {
			this.name=name;
	}
	run(){  /*实例方法*/
		alert(`${this.name}在运动`)
	}
	static print(){/*静态方法 里面没法直接调用类里面的属性*/
		alert('print方法' + Per.sex);
		alert('print方法'+this.age);//报错
	}
}
var p=new Per('张三');
p.run();//实例化Per后调用实例方法
Per.print();//通过类名.方法 直接调用静态方法
alert(Per.sex);//静态属性的调用

typeScript中类的抽象类 继承 多态

多态:父类定义一个方法不去实现，让继承它的子类去实现  每一个子类有不同的表现【多态属于继承】

class Animal {
	name:string;
	constructor(name:string) {
		this.name=name;
	}
	eat(){//具体细节由继承它的子类去实现 ，每一个子类的表现不一样
		console.log('吃的方法')
	}
}
class Dog extends Animal{
	constructor(name:string){
		super(name)
	}
	eat(){
		return this.name+'吃肉'
	}
}
class Cat extends Animal{
	constructor(name:string){
		super(name)
	}
	eat(){
		return this.name+'吃粮食'
	}
}

• 多态:父类定义typescript中的抽象类：它是提供其他类继承的基类，不能直接被实例化。
• 抽象类中可以包含非抽象方法；但必须至少包含一个抽象方法
• 用abstract关键字定义抽象类和抽象方法，抽象类中的抽象方法不包含具体实现并且必须在派生类中实现。
• abstract抽象方法只能放在抽象类里面
• 抽象类和抽象方法用来定义标准

abstract class Animal{
    public name:string;
    constructor(name:string){
        this.name=name;
    }
    abstract eat():any;  //抽象方法不包含具体实现并且必须在派生类中实现。
    run(){
        console.log('其他方法可以不实现')
    }
}
var a=new Animal() /*错误的写法：抽象类提供其他类继承的基类，不能直接被实例化*/

abstract class Animal{
    public name:string;
    constructor(name:string){
        this.name=name;
    }
    abstract eat():any;  //抽象方法不包含具体实现并且必须在派生类中实现。
    run(){
        alert('其他方法可以不实现')
    }
}
class Dog extends Animal{
    constructor(name:any){
        super(name)
	}
    eat(){
        alert(this.name+'吃肉')
    }
}
var d=new Dog('Dog');
d.eat();
class Cat extends Animal{
    constructor(name:any){
        super(name)
    }
	run() { }
	//抽象类的子类必须实现抽象类里面的抽象方法
    eat(){
        alert(this.name+'吃粮食')
    }
}
var c=new Cat('Cat');
c.eat();