ts学习-4

1.ts中的类和类的继承 

//ts中的类定义
class Person{
    name:string;//属性 前面省略了public关键字
    constructor(name:string){
        this.name=name;
    }
    getName():void{
        console.log("类中的获取name的值："+this.name) 
    }
    setName(name:string):void{
        this.name=name
    }
 }
 let p=new Person('怒放的阿旭');
 p.getName();
 p.setName('yangdongxu');
 p.getName();
 class Web extends Person{
     constructor(name:string){
         super(name);/* 初始化父类的构造函数 */
     }
 }
 let w=new Web('web的值：：：');
 w.getName();

2.类的修饰符

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

 public ：公有 在类里面、在子类中里面可以访问在外部可以访问

 protected :保护类型 在类的里面、字类里面可以访问 在外部不可以访问

 private :私有属性 在类里面可以访问 字类、类的外部没法访问

 属性如果不加修饰符 默认是公有 (public)

/* 
 类的修饰符 typescript里面定义属性的时候给我们提供了三种修饰符
 public ：公有 在类里面、在子类中里面可以访问在外部可以访问
 protected :保护类型 在类的里面、字类里面可以访问 在外部不可以访问
 private :私有属性 在类里面可以访问 字类、类的外部没法访问
 属性如果不加修饰符 默认是公有 (public)
 */
class pub{
   public name:string;
//    private name:string;
//    protected name:string;
   constructor(name:string){
      this.name=name;
   }
   getName(){
       console.log("pub中的属性："+this.name);
   }
}
let outPub=new pub('name');
outPub.getName();//自己内部调用
console.log("外部调用："+outPub.name);//外部使用属性
class sonPub extends pub{
    constructor(name:string){
        super(name)
    }
}
let sonP=new sonPub('sonP');
sonP.getName();//字类访问属性

静态的方法和静态的属性的使用

class Han{
    static animal:string='static_prototype';//静态属性的定义
    constructor(name:string){
    }
    static print(){
        console.log("//调用静态的方法",Han.animal);//获取静态的属性
    }
}
let H=new Han('Han_name');//
Han.print();//调用静态的方法

多态：父类中定义一个方法，在子类中去实现  每个子类对这个方法都有自己独特的实现的方式 这就是多态 

class Han{
    thing:string;
    constructor(name:string){
        this.thing=name;
    }
    eat(){
        console.log("//animal的子类都有吃的方法,每个子类吃的方式不一样",this.thing);//eat的方法
    }

}
class dog extends Han{
    constructor(name:string){
        super(name)
    }
    eat(){
       console.log('dog类对象吃的方法中的thing:',this.thing); 
    }
}
class cat extends Han{
    constructor(name:string){
        super(name)
    }
    eat(){
       console.log('cat类对象吃的方法中的thing:',this.thing); 
    }
}
new dog('粮食类').eat();
new cat('吃老鼠类').eat();

抽象的类：1.在抽象类中的类不能实例化 定义的抽象方法不包含具体的实现并且要在子类中实现  

  

abstract class Han{
    thing:string;
    constructor(name:string){
        this.thing=name;
    }
    abstract eat():any;

}
class dog extends Han{
    constructor(name:string){
        super(name)
    }
    eat(){
       console.log('dog类对象吃的方法中的thing:',this.thing); 
    }
}
class cat extends Han{
    constructor(name:string){
        super(name)
    }
    eat(){
       console.log('cat类对象吃的方法中的thing:',this.thing); 
    }
}
new dog('粮食类').eat();
new cat('吃老鼠类').eat();

属性的接口：

//属性的接口
interface FullName {
    firstName:string;
    lastName:string;
}
function add(name:FullName):any{
    console.log(`接口中的demo：${name.firstName},${name.lastName}`);
}
add({
    firstName:'dongxu',
    lastName:'yang'
});

接口可选参数：

//属性的接口 属性可选 加？  lastName可传递 可不传递
interface FullName {
    firstName:string;
    lastName?:string;
}
function add(name:FullName):any{
    console.log(`接口中的demo：${name.firstName},${name.lastName}`);
}
add({
    firstName:'dongxu'
    // lastName:'yang'
});

接口的用途 封装原生的ajax

//接口的用途 封装原生的ajax
interface Config{
    type:string;
    url:string;
    data?:string,
    dataType:string
}
function ajax(config:Config){
    let xhr=new XMLHttpRequest();
    xhr.open(config.type,config.url,true);
    xhr.send(config.data);
    xhr.onreadystatechange=function(){
        if(xhr.readyState==4&&xhr.status==200){
            if(config.dataType=='json'){
                console.log(JSON.parse(xhr.responseText))
            }else{
                console.log(xhr.responseText)
            }
        }
    }
}
ajax({
    type:'get',
    url:'http://a.itying.com/api/productlist',
    data:'',
    dataType:'json'
})

函数中接口的使用：对方法中的参数和返回数值进行约束

//函数接口的使用
interface getInfo{
  (name:string,age:number):string
}
let getFn:getInfo=function(name:string,age:number):string{
    let a=name+age;
    console.log(a);
   return a
}
getFn('yangdongxu=====',2000);

 可索引的接口 数组/对象的约束 （不常用）

// 数组的规范接口
interface UserArr{
    [index:number]:string//索引是数字 数值是字符串
}
let arr=['zhagsang','lisi'];
console.log(arr);//["zhagsang", "lisi"]
//对象接口  
interface Obj{
    [name:string]:string//对象中的key value都是字符串
}
let obj:Obj={
    name:'saa'
}

定义一个类的接口

interface Animal{
    name:string;
    eat(name:string):void
}
//实现定义的类的接口的类
class dog implements Animal{
    name:string;
    constructor(name:string){
        this.name=name;
    }
    eat(name:string){
        console.log(this.name+name)
    }
}
let d=new dog('dog_xiaolei');
d.eat('东西');

 接口的继承：

//  接口可以继承接口
interface Animal{
    eat():void
}
interface Person extends Animal{
    work():void
}
//在类中要实现接口和继承的接口中的方法
class Web implements Person{
    name:string;
    constructor(name:string){
        this.name=name;
    }
    eat():void{
     console.log(`${this.name}吃好吃的东西`)
    }
    work():void{
        console.log(`${this.name}努力的工作`)
    }
}
let pe=new Web('小杨');
pe.eat();
pe.work();

在类中要实现接口和继承的接口中的方法  并且要实现继承一个类

 

//  接口可以继承接口
interface Animal{
    eat():void
}
interface Person extends Animal{
    work():void
}
//一个要被web继承的父亲类
class programer{
    name:string;
    constructor(name:string){
        this.name=name;
    }
    codeing(name:string):void{
      console.log(this.name+name)
    }
}

//在类中要实现接口和继承的接口中的方法  并且要实现继承一个类
class Web  extends programer implements Person{
    // name:string;
    constructor(name:string){
        // this.name=name;
        super(name)
    }
    eat():void{
     console.log(`${this.name}吃好吃的东西`)
    }
    work():void{
        console.log(`${this.name}努力的工作`)
    }
}

let WebC=new Web('小杨');
WebC.eat();
WebC.work();
WebC.codeing('写ts代码');