初学TypeScript07(泛型)

205 阅读2分钟

泛型的定义

泛型(Generics)是指在定义函数、接口或类的时候,不预先指定具体的类型,而在使用的时候再指定类型的一种特性(此处拷贝的阮一峰大神的解释) 以前没用过泛型所以这里用了一个泛型参数更多可以看 ts.xcatliu.com/advanced/ge…

//下面是一个简单函数泛型 T=string 表示泛型参数的默认类型
function People<T=string>(name:T): T {
    return name
}

People<number>(123)
People<string>('123')

泛型类

下面写一个选取最小值小案例,用于巩固自己学习

class People<T> {
   list:T[]=[]
   add(a:T):void{
       this.list.push(a)
   }
   min():T{
       let min = this.list[0]
       for(var i=0;i<this.list.length;i++){
           if(min>this.list[i]){
               min = this.list[i]
           }
       }
       return min
   }
}
// 案例选出数组最小值
var p = new People<number>()
p.add(12)
p.add(4)
p.add(1)
p.add(15)
alert(p.min())


var p1 = new People<string>()
p1.add('b')
p1.add('g')
p1.add('f')
p1.add('a')
alert(p1.min())

泛型接口 (常用的俩种定义方式)

//第一种
interface People{
    <T> (name:T):T
}
var cat:People =function<T>(name:T):T{
    return name
}
alert(cat<string>('asda'))
alert(cat<number>(111))
//第二种
interface Config <T>{
    (name:T):T
}
function animal<T>(name:T) :T{
  return name
}
var a:Config<string> = animal

泛型运用到类中

写一个数据有关的小案例

//  定义一个user类 这个类的作用就是映射数据库字段  然后定一个MysqlDb类用于操作数据库增删改查 然后把user类作为参数传入到 MysqlDb
class User {
    username:string | undefined;
    password:string | undefined;
    constructor(user:string,pas:string) {
        this.username = user
        this.password = pas
    }
}
class MysqlDb {  
    add(params:User):boolean{
        console.log(params)
        return true
    }
}
var user = new User('小明','12323')
var db = new MysqlDb()
db.add(user)

// 假如现在有一个New也需要添加到数据库那么跟上面写法一致 
class News {
    title:string | undefined;
    content:string | undefined;
    constructor(user:string,pas:string) {
        this.title = user
        this.content = pas
    }
}
class MysqlDb {  
    add(params:News):boolean{
        console.log(params)
        return true
    }
}
var user = new News('小明','12323')
var db = new MysqlDb()
db.add(user)

通过以上2种不同种类添加数据库的方式 发现我们写了冗余代码 就是都创建了一个 MysqlDb类 那么是否可以把这个类创建成一个泛型来实现

class User {
    username:string | undefined;
    password:string | undefined;
    constructor(user:string,pas:string) {
        this.username = user
        this.password = pas
    }
}

class News {
    title:string | undefined;
    content:string | undefined;
    isselect?: boolean | undefined;
    constructor(user:string,pas:string) {
        this.title = user
        this.content = pas
    }
}

// 创建一个泛型类
class MysqlDb <T> {  
    add(params:T):boolean{
        console.log(params)
        return true
    }
}

var user = new User('小明','12323')
var db = new MysqlDb<User>()
db.add(user)

var news = new News('小明','12323')
news.isselect = true
var db1 = new MysqlDb<News>()
db1.add(news)

//当创建的MysqlDb没有限制泛型类型也就是没有<user>等时 那么 db2.add(任意)不会报错
var db2 = new MysqlDb()
db2.add(123)
db2.add('444')