ES5的话 类主要靠的是构造函数原型链 这个就不多说了 感兴趣的朋友可以去看一下 但构造函数和原型链的用法 我老实说 他开始展现出被一些更规范语法取代的意向
ts定义一个基础类通过一个class的关键字
代码如下
class min{
name:String;
constructor(){
this.name = '你好';
console.log(this.name);
}
}
let mint = new min();
运行效果就是 打印出了 ( 你好 ) 两个字
这里class 后的min是类的名字 这个大家可以随便起名
最上面的name是定义在类中的属性 constructor是类的构造函数
当这个类被实例化是 构造函数会自动执行
通常用来给类中的属性赋值
TS类中还可以定义函数 我们来看个有点多的代码
class min{
name:String;
age:Number;
constructor(name:String, age:Number){
this.name = name;
this.age = age;
}
getName():String {
return this.name
}
getAge():Number {
return this.age
}
setAge(age):void {
this.age = age
}
setName(name):void {
this.name = name
}
}
let mint = new min('裴元吉', 22);
console.log(mint.getAge())
console.log(mint.getName())
mint.setAge(50)
console.log(mint.getAge())
mint.setName('黄忠')
console.log(mint.getName())
这个代码相对就有点多了 确实也简单 我们在类中定义了两个属性
name:String 字符串类型的属性name
age:Number 数字类型的属性age
类的构造函数接收两个参数 然后在构造函数中给类自己的两个属性赋值
分别定义类他们的get和set方法
然后用一个mint 属性接收实例化min类 注意 实例化类就相当于调用了他的构造函数 就也要传递构造函数需要的参数
这里我们的打印效果如下
其次就是类的继承 这里我们就用上面的代码小改一下
class min{
name:String;
age:Number;
con:String;
constructor(name:String, age:Number){
this.name = name;
this.age = age;
}
getName():String {
return this.name
}
getAge():Number {
return this.age
}
setAge(age):void {
this.age = age
}
setName(name):void {
this.name = name
}
}
class kowd extends min{
con:String;
constructor(name:String, age:Number,con:String){
super(name,age)
this.con = con;
console.log(con);
}
}
let mint = new kowd('裴元吉', 22, '我是新来的');
console.log(mint.getAge())
console.log(mint.getName())
mint.setAge(50)
console.log(mint.getAge())
mint.setName('黄忠')
console.log(mint.getName())
这里大家可以发现唯一不同的地方在于这个kowd
这里我们声明了一个kowd类 他通过关键字extends继承了我们之前声明的类min
其他的没什么 但继承了父类那在工造函数中一定要调用super 并在这个函数中传递父类构造函数中需要的参数 否则就会报错
然后在子类中可以拿到父类的属性和函数
这段代码的输出效果如下
