4、typescript中的类

/**

 * 1、类的定义

 * 2、继承

 * 3、类里面的修饰符

 * 4、静态属性 静态方法

 * 5、继承多态、抽象类、抽线方法

*/

1、ts中定义类

es5：

function Person(nanme){
    this.name = name;
    this.run = function(){
        console.log(this.name)
    }
}
var p = new Person('张三');
p.run()

typescript：

class Person{
    name:string;    //属性  前面省略了public关键词
    constructor(n:string){  //构造函数  实例化类的时候出发的方法
        this.name = n;
    }
    run():void{
        alert(this.name+'在做运动');
    }
}
var p = new Person("张三");
p.run();

typescript给类中添加方法：

class Person{
    name:string;
    constructor(name:string){
        this.name = name;
    }
    getName():string{//定义方法取值
        return this.name;
    }
    setName(name:string):void{//方法传值 改变属性
        this.name = name;
    }
}
var p = new Person("张三");
alert(p.getName());
p.setName('李四');
alert(p.getName());　

2、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())

class Web extends Person{
    constructor(name:string){
        super(name);//初始化父类的构造函数
    }
}
var w = new Web('李四');
alert(w.run())

// ts中继承的探讨 父类的方法和字类的方法一致

class Person{
    name:string;
    constructor(name:string){
        this.name = name;
    }
    run():string{
        return `${this.name}在跑步`
    }
}
class Web extends Person{//继承父类的属性和方法
    constructor(name:string){
        super(name);//初始化父类的构造函数
    }
    // 现在字类里面找 再去父类里面找
    run():string{
        return `${this.name}在跑步-字类`
    }
    // 还能扩展自己的方法
    work(){
        alert(`${this.name}在工作`)
    }
}
var w = new Web('李四');
w.work();
w.run();

　　先在子类里面找 再去父类里面找

3、类里面的修饰符

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}在工作`)
    }
}
// public
var w = new Web('王五');//public name:string;
w.work();

// protected
var w = new Web('李四111');//protected name:string;
alert(w.work());//李四111在工作 在字类中可以访问
alert(w.run());//李四111在运动  在父类中可以访问
var p = new Person('哈哈哈');alert(p.name)//p.name可以编译 但是会报错，控制台上也有提醒，name是保护类型。

// private

4、静态属性 静态方法

es5静态方法和属性

function Person(){
    this.run1=function(){

    }
}
Person.name='哈哈哈';//静态属性
Person.run2=function(){//静态方法

}
var p=new Person();
Person.run2();//静态方法的调用

$('#box').css('color','red');
function $(ele){
    return new Base(ele);
}
function Base(ele){
    this.ele = 获取dom节点;
    this.css=function(arr,val){//实例方法
        this.ele.style.arr = val;
    }
}
// 静态方法调用
$.get('url',function(){

})
// 定义静态方法
$.get=function(){

}

　ts中的静态方法和属性

class Person {
    name:string;
    static age:number=20;//静态属性
    constructor(name:string) {
        this.name = name;
    }
    run(){//实例方法
        alert(`${this.name}在运动`)
    }
    work(){//实例方法
        alert(`${this.name}在共工作`)
    }
    static print(){//静态方法
        // 没法直接调用类里面的属性
        alert('静态方法'+this.name);
        // 需要定义静态属性才能访问Person.age
        alert('静态方法'+Person.age);
    }
}
Person.print();//静态方法调用
alert(Person.age);//静态属性调用

5、多态；抽象方法 抽象类

//父类定义一个方法不去实现，让继承他的字类去实现，每一个字类有不同的表现。

//多态属于继承

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中的抽象类：他是提供其他类继承的基类，不能直接被实例化。

var a =new Animal();//无法创建抽象类的实例

用abstract关键字定义抽象类和抽象方法，抽象类中的抽象方法不包含具体实现并且在派生类中实现。

class Animal {  //抽象方法只能放在抽象类中
　　abstract eat():any;
 }

// 抽象类和抽象方法来定义标准

// Animal这个类要求其他的字类必须包含eat方法

// 抽象方法实现多态

abstract class Animal {
    name:string;
    constructor(name:string){
        this.name = name;
    }
    abstract eat():any;//抽象类中的抽象方法不包含具体实现并且在派生类中实现。
    run(){
        console.log('其他方法可以不实现');
    }
}
//var a =new Animal();//错误写法 无法创建抽象类的实例

class Dog extends Animal {
    constructor(name:any){
        super(name);
    }
    // 抽象类的子类必须实现抽象类里面的抽象方法
    eat(){
        console.log(this.name + '吃粮食')
    }
}
var d=new Dog('小黑');
d.eat();

class Cat extends Animal {
    constructor(name:any){
        super(name);
    }
    // 抽象类的子类必须实现抽象类里面的抽象方法
    eat(){
        console.log(this.name + '吃老鼠')
    }
}
var c=new Cat('小花猫');
c.eat();