类的定义
ES5中类的定义
-
ES5中通过function定义构造函数来实现。
-
构造函数和原型链两种方式定义属性和方法,区别在于原型链定义的方法和属性会被多个实例共享,构造函数不会
//通过构造函数定义属性和方法 function Person(){ this.name = 'zhangsan'; this.age = 20; this.run = function(){ console.log( this.name+" is running."); }//实例方法 } //通过原型链定义属性和方法,和构造函数定义的区别是:原型链定义的方法和属性会被多个实例共享,构造函数不会 Person.prototype.sex = "male"; Person.prototype.work = function (){ console.log(this.name+" is working."); } var p = new Person(); console.log(p.name); //输出:zhangsan p.run(); //输出:zhangsan is running. p.work(); //输出:zhangsan is working.
-
添加静态方法直接Person.funxx()=function(){}的方式添加,通过Person.funxx()调用。
//静态方法定义 Person.getInfo = function(){ console.log("I am static method") } //静态方法调用 Person.getInfo(); //输出I am static method
-
类的继承通过原型链+对象冒充的组合继承模式
- 对象冒充实现如下,缺点:可以继承构造函数里的属性和方法,不能继承原型链中的属性和方法
//对象冒充实现继承 function web(){ Person.call(this); } var w = new web(); w.run(); //输出: zhangsan is running. w.work(); //输出: Uncaught TypeError: w.work is not a function
- 原型链继承实现如下, 优点:可以继承构造函数和原型链中的属性和方法。缺点:实例化子类时,不能给父类传参。
//原型链继承 function Web(){ } Web.prototype = new Person(); var w1 = new Web(); w1.run(); //输出: zhangsan is running. w1.work(); //输出: zhangsan is working.
不能通过原型链把子类的参数传递给父类
function Person(name, age){ this.name = name; this.age = age; this.run = function(){ console.log( this.name+" is running."); } } //原型链继承 function Web(){ } Web.prototype = new Person(); var w1 = new Web('abby',18); w1.run(); //输出: undefined is running. w1.work(); //输出: undefined is working.
-
原型链+构造函数组合继承模式 实现方式1
function Person(name, age){ this.name = name; this.age = age; this.run = function(){ console.log( this.name+" is running."); } } Person.prototype.sex = "male"; Person.prototype.work = function (){ console.log(this.name+" is working."); } //原型链+对象冒充继承. 写法1 function Web(name, age){ Person.call(this,name, age) } Web.prototype = new Person(); var w1 = new Web('abby',18); w1.run(); //输出: abby is running. w1.work(); //输出: abby is running.
//原型链+对象冒充继承. 写法2 function Web(name, age){ Person.call(this, name, age); } Web.prototype = Person.prototype; var w2 = new Web('jelly',6); w2.run(); //输出: jelly is running. w2.work(); //输出: jelly is working.
Typescript 中的类
Typescript中类的定义
avascript
class Person{
name: string; //此处省略public关键字
age: number;
constructor(name:string, age:number){ //构造函数,实例类时调用的函数
this.name = name;
this.age = age;
}
getName():string{
return this.name;
}
setName(name:string):void{
this.name = name;
}
run():void{
console.log(this.name+" is "+this.age+" ,"+this.name+" is running")
}
}
let p = new Person('abby', 18);
p.run(); //输出: abby is 18 ,abby is running
p.setName("lisi");
p.run(); //输出: lisi is 18 ,lisi is running
Typescript中类的继承(通过extend, super实现)
通过"父类 extend 子类" 的方式实现继承,如果需要实现子类的构造函数,则在constractor中加入super(参数1,参数2 …).
//类的继承
class Web extends Person{
sex: string;
constructor(name:string, age:number, sex:string){
super(name+name, age);
this.sex = sex;
}
work():void{
console.log(`${this.name} is ${this.age}, ${this.name} is ${this.sex}, working, working`)
}
}
let w = new Web('jelly',5, 'female')
w.run(); //输出: jellyjelly is 5 ,jellyjelly is running
w.setName("jason")
w.work(); //输出: jellyjelly is 5, jellyjelly is female, working, working
Tpyescript中类里面的修饰符
public : 类里面,子类,类外部都可以访问。
protected:类里面,子类中可以访问,类外部不可以访问。
private:类里面可以访问,子类和类外部都不可以访问。
属性如果不加修饰符,默认是public。
Typescript中的静态方法
静态方法通过关键字static表示,不能调用类中的非静态属性,只能调用静态属性(用static关键字表示的属性)。
class Person{
name: string; //此处省略public关键字
age: number;
static print_num = 0
constructor(name:string, age:number){ //构造函数,实例类时调用的函数
this.name = name;
this.age = age;
}
//stacit 表示静态方法, 静态方法中不能调用类中的非静态属性
static print(){
console.log("I am in print function,print number is "+this.print_num);
this.print_num+= this.print_num;
}
}
Person.print(); //输出: I am in print function,print number is 0
Typescript 中的多态性
多态:父类定义一个方法不去实现,让继承它的子类去实现,每一个子类有不同的表现。
//多态实例
class Animal {
name:string;
constructor (name:string){
this.name = name;
}
eat():any{
console.log("eat what?")
}
}
class Dog extends Animal{
food:string = 'dog food';
eat():any{
return (`The ${this.name} eat ${this.food}`)
}
}
class Cat extends Animal{
food: string = 'cat food';
eat():any{
return (`The ${this.name} eat ${this.food}`)
}
}
let dog = new Dog("dog");
console.log(dog.eat()); //输出: The dog eat dog food
let cat = new Cat("cat");
console.log(cat.eat()); //输出: The cat eat cat food
Typescript中的抽象类
- 抽象类是提供其它类继承的基类,不能直接被实例化。
- 用abstract关键字定义抽象类和抽象方法,抽象类中的抽象方法不包括具体实现,并且必须在派生类中实现。
- 抽象方法只能放在抽象类中,抽象类中可以包含非抽象方法,但是一般都需要定义抽象方法,否则没意义。
- 抽象类和抽象方法用来定义标准。
//抽象类实例
abstract class Animal {
name:string;
constructor (name:string){
this.name = name;
}
abstract eat():any; //抽象方法定义
}
class Dog extends Animal{
food:string = 'dog food';
eat():any{
return (`The ${this.name} eat ${this.food}`)
}
}
class Cat extends Animal{
food: string = 'cat food';
eat():any{
return (`The ${this.name} eat ${this.food}`)
}
}
let dog = new Dog("dog");
console.log(dog.eat()); //输出: The dog eat dog food
let cat = new Cat("cat");
console.log(cat.eat()); //输出: The cat eat cat food