了解JavaScript中的原型继承

Question

我是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();

为什么笔者添加Drive和Fly使用方法prototype，并没有宣布他们的this.Drive内部方法Car类和this.Fly在SuperCar类？

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

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

var myCar = new Car("Car");

Answer 1

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

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

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