Typescript学习笔记——typescript中的类

es5 创建对象 继承

// 1.最简单的类

function Person(){

   this.name='张三'

   this.age=20

}

var p = new Person();

// 2.构造函数和原型链里面增加方法

function Person(){

   this.name='张三'   // 属性

   this.age=20

   this.run=function(){

     alert(this.name+'在运动')

   }

}

Person.prototype.sex="男";

Person.prototype.work=function(){

     alert(this.name+'在工作')

}

var p = new Person();

p.run()

p.work()

// 3.类里面的静态方法

function Person(){

   this.name='张三'   // 属性

   this.age=20

   this.run=function(){     // 实例方法

     alert(this.name+'在运动')

   }

}

Person.getInfo=function(){

     alert('我是静态方法');

}

Person.getInfo(); // 调用静态方法

// 4.es5里面的继承

function Person(){

   this.name='张三'   // 属性

   this.age=20

   this.run=function(){

     alert(this.name+'在运动')

   }

}

Person.prototype.sex="男";

Person.prototype.work=function(){

     alert(this.name+'在工作')

}

// web 类 继承Person类 原型链+对象冒充的组合继承模式

function Web(){

    Person.call(this)  // 对象冒充实现

}

var w=new Web();

w.run(); // 对象冒充可以继承构造函数里面的属性和方法

w.work(); // 对象冒充可以继承构造函数里面的属性和方法，但是没法继承原型链上面的属性和方法

// es5里面的继承 原型链实现继承

function Person(){

   this.name='张三'   // 属性

   this.age=20

   this.run=function(){

     alert(this.name+'在运动')

   }

}

Person.prototype.sex="男";

Person.prototype.work=function(){

     alert(this.name+'在工作')

}

// web 类 继承Person类 原型链+对象冒充的组合继承模式

function Web(){

    Person.call(this)  // 对象冒充实现

}

Web.prototype = new Person();   // 原型链现实继承

var w=new Web();  // 原型链实现继承：可以继承构造函数里面的属性和方法，也可以继承原型链上面的属性和方法

w.run();

w.work();

// 6.原型链实现继承的 问题？

function Person(name,age){

   this.name=name;   // 属性

   this.age=age;

   this.run=function(){

     alert(this.name+'在运动')

   }

}

Person.prototype.sex="男";

Person.prototype.work=function(){

     alert(this.name+'在工作')

}

 

function Web(name,age){

 

}

Web.prototype=new Person();

var w=new Web('赵四'，20);  // 实例化子类的时候，没法给父类传参

w.run() // 输出undedined在运动

// 7.原型链+构造函数的组合继承模式

function Person(name,age){

   this.name=name;   // 属性

   this.age=age;

   this.run=function(){

     alert(this.name+'在运动')

   }

}

Person.prototype.sex="男";

Person.prototype.work=function(){

     alert(this.name+'在工作')

}

 

function Web(name,age){

   Person.call(this,name,age); // 对象冒充继承，实例化子类可以给父类传参

}

Web.prototype=new Person();

var w=new Web('赵四'，20);  

w.run()

// 8.原型链+对象冒充继承的另一种方式

function Person(name,age){

   this.name=name;   // 属性

   this.age=age;

   this.run=function(){

     alert(this.name+'在运动')

   }

}

Person.prototype.sex="男";

Person.prototype.work=function(){

     alert(this.name+'在工作')

}

 

function Web(name,age){

   Person.call(this,name,age); // 对象冒充继承，可以继承构造函数里面的属性和方法，实例化子类可以给父类传参

}

Web.prototype=Person.protype;

var w=new Web('赵四'，20);  

w.run()

 

TypeScript中类的定义，继承，类里面的修饰符

// 1.ts中类的定义

class Person{

     name:string;   //属性 前面省略了public关键词

     constructor(n:string){  //构造函数  实例化类的时候触发的方法

            this.name=n;

     }

     run():void{

          alert(this.name)

     }

}

var p=new Person('张三')；

p.run()

 

class Person{

     name:string;   //属性 前面省略了public关键词

     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('王五')；

p.run();  // 输出王五在运动

class Web extends Person{

　　constructor(name:string){

　　　　super(name);  // 初始化父类的构造函数

　　}

　　run():string{

　　　　return `$(this.name)在运动`

　　}

}

var w=new Web('李四');

alert(w.run());

// 3.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(); // 输出李四在运动-子类

// 4.类里面的修饰符 typescript里面定义属性的时候给我们提供了 三种修饰符

public :公有                在类里面、子类 、类外面都可以访问

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

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

// 属性如果不加修饰符默认就是public（公有）

 

TypeScript类中的静态属性，静态方法，抽象类，多态

// es5中的静态属性 静态方法

function Person(){

　　this.run1=function(){   //实例方法

　　

　　}

}

var p=new Person();

p.run1();  // 实例方法调用

Person.name='哈哈哈哈哈'  // 静态属性

Person.run2=function(){  //静态方法

 

}

Person.run2()  // 静态方法的调用

// ts中静态方法

class Person{

　　public name:string;

　　punlic age:number;

 

　　static sex='男' 　　// 静态属性

　　constructor(name:string){

　　　　this.name=name;

　　}

　　run(){     // 实例方法

　　　　alert(`${this.name}在运动`)

　　}

　　work(){   // 实例方法

　　　　alert(`${this.name}在工作`)　　　

　　}

　　static print(){    // 静态方法  里面没法直接调用类里面的属性 只能调用静态属性

　　　　alert('print方法'+Person.sex)  

　　}

}

var p=new Person('张三')

p.run();

Person.print()   // 调用静态方法

// ts中多态： 父类定义一个方法不去实现，让继承它的子类去实现，每一个子类有不同的表现

// 多态属于继承

class Animal{

　　name:string;

　　constructor(name:string){

　　　　this.name=name

　　}

　　eat(){   // 具体吃什么 不知道 具体吃什么？继承他的子类去实现，每一个子类的表现不一样

　　　　console.log('吃的方法')

　　}

}

class Dog extends Animal{

　　construtor(name:string){

　　　　super(name)

　　}

　　eat(){

　　　　return this.name+'吃狗粮'

　　}

}

class Cat extends Animal{

　　construtor(name:string){

　　　　super(name)

　　}

　　eat(){

　　　　return this.name+'吃猫粮'

　　}

}

// typescript中的抽象类：他是提供其他类继承的基类，不能直接被实例化

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

// abstract抽象方法只能放在抽象类里面

// 抽象类和抽象方法用来定义标准 ，标准：Animal 这个类的子类必须包含eat方法

abstract class Animal{

　　public name:string;

　　constructor(name:string){

　　　　this.name=name

　　}

　　abstract eat():any;

}

class Dog extends Animal{

　　// 抽象类的子类必须实现抽象类里面的抽象方法

　　constructor(name:any){

　　　　super(name)

　　}

　　eat(){

　　　　console.log(this.name+'吃狗粮')

　　}

}

var d=new Dog(‘小狗’);

d.eat();