小编典典

了解JavaScript中的原型继承

javascript

我是JavaScript OOP的新手。您能否解释以下代码块之间的区别?我测试了两个模块。什么是最佳做法,为什么?

第一块:

function Car(name){

    this.Name = name;

}



Car.prototype.Drive = function(){

    console.log("My name is " + this.Name + " and I'm driving.");

}



SuperCar.prototype = new Car();

SuperCar.prototype.constructor = SuperCar;



function SuperCar(name){

    Car.call(this, name);

}



SuperCar.prototype.Fly = function(){

    console.log("My name is " + this.Name + " and I'm flying!");

}



var myCar = new Car("Car");

myCar.Drive();



var mySuperCar = new SuperCar("SuperCar");

mySuperCar.Drive();

mySuperCar.Fly();

第二块:

function Car(name){

    this.Name = name;

    this.Drive = function(){

        console.log("My name is " + this.Name + " and I'm driving.");

    }

}



SuperCar.prototype = new Car();



function SuperCar(name){

    Car.call(this, name);

    this.Fly = function(){

        console.log("My name is " + this.Name + " and I'm flying!");

    }

}



var myCar = new Car("Car");

myCar.Drive();



var mySuperCar = new SuperCar("SuperCar");

mySuperCar.Drive();

mySuperCar.Fly();

为什么笔者添加DriveFly使用方法prototype,并没有宣布他们的this.Drive内部方法Car类和this.FlySuperCar类?

为什么SuperCar.prototype.constructor需要重新设置为SuperCar?是constructor当覆盖的属性prototype设置?我注释了这一行,没有任何改变。

为什么叫Car.call(this, name);SuperCar构造函数?Car当我这样做时,不会被“继承”的属性和方法

var myCar = new Car("Car");

阅读 249

收藏
2020-04-25

共1个答案

小编典典

这两个块的不同之处在于,在第一个示例中该实例Drive()仅存在一次,而在第二种方法中Drive()每个实例将存在一次(每次执行new Car()该功能时,drive()都会再次创建该函数)。或不同,第一个使用原型存储函数,第二个使用构造函数。对函数的查找是构造函数,然后是原型。因此,Drive()无论您是在构造函数中还是在原型中,都可以通过查找找到它。使用原型的效率更高,因为通常每个类型只需要一个函数。

newjavascript中的调用会自动在原型中设置构造函数。如果要覆盖原型,则必须手动设置构造函数。

javascript中的继承与没什么不同super。因此,如果您有子类,则调用超级构造函数的唯一机会就是其名称。

2020-04-25