ES5:类与类继承

591 阅读1分钟

ES5类

//类构造函数
function Person(){
    this.name = "zhang san";
    this.run = ()=>{
        alert(this.name);
    }
}
//静态方法
Person.getInfo = ()=>{
    alert("我是静态方法");
}
//原型链上的属性会被多个实例共享 构造函数不会
Person.prototype.sex = "男";
//原型方法
Person.prototype.work = ()=>{
    alert(this.name+" work");   
}

var p = new Person();
p.work();
Person.getInfo();

ES5类继承

//原型链+对象冒充的组合继承模式。
//Web类继承 Person类
function Person(){
    this.name = "张三";
    this.run = ()=>{
        alert(this.name+"在运动");
    }
}
Person.prototype.sex = "男";
Person.prototype.work = ()=>{
    alert(this.name+" work");   
}
//(1)对象冒充继承:可以继承构造函数里面的属性和方法,但是不能继承原型链里面的属性和方法
function Web(){
    Person.call(this); /*对象冒充实现继承 */
}
var w = new Web();
w.run(); //正确 构造函数中的方法
w.work();//错误 原型链中的方法

//(2)原型链继承:可以继承构造函数和原型链上的属性和方法
function Web(){}
Web.prototype = new Person(); //原型链实现继承。
var w = new Web();
w.run();//正确
w.work();//正确

//(3)原型类继承的问题?父类:function Person(name)的情况下,实例化子类的时候没办法给父类传参。

//(4)对象冒充+原型类 实现继承
function Person(name,age){
    this.name = name;
    this.age = age;
    this.run = ()=>{
        alert(this.name+"在运动");
    }
}
Person.prototype.sex = "男";
Person.prototype.work = ()=>{
    alert(this.name+" work");   
}
function Web(name,age){
    Person.call(this,name,age); //对象冒充继承构造函数
}
Web.prototype = Person.prototype; //原型链继承原型链
// Web.prototype = new Person(); 
var w = new Web("张三");
w.run();//正确
w.work();//正确