function Plant() {
  this.country = "Mexico"
  this.isOrganic = true;
}

function Fruit(fName, fColor) {
  this.name = fName;
  this.color = fColor;
}

Fruit.prototype = new Plant();

var abanana = new Fruit("Banana", "Yellow")
console.log(abanana.constructor)


因此,在我的代码中,我尝试使用原型继承。每次我创建一个Fruit的新实例(var aFruit = new Fruit())时,都会从Fruit构造函数的Fruit.prototype中分配该新实例的原型。

那为什么是abanana.constructor


[function: Fruit]




[function: Plant]?


我认为这就是构造方法的作用:


  此外,所有从另一个对象继承的对象也都继承一个构造函数属性。而且此构造函数属性只是一个保存(或指向)对象构造函数的属性(与任何变量一样)。

最佳答案

该代码有两个问题:


使用new Plant()创建Fruit.prototype是可悲的反模式;而是使用Object.create并从Plant内调用Fruit。在您的特定代码中并没有多大关系,但是如果您想从Fruit派生某些东西,或者是否想将country用作Plant的参数,那将很重要。
如果要使其指向constructor,则需要在Fruit.prototype上设置Fruit


所以:

function Plant() {
  this.country = "Mexico"
  this.isOrganic = true;
}

function Fruit(fName, fColor) {
  Plant.call(this);                               // **
  this.name = fName;
  this.color = fColor;
}

Fruit.prototype = Object.create(Plant.prototype); // **
Fruit.prototype.constructor = Fruit;              // **


当然,从ES2015开始,我们具有class语法,您现在可以将其与编译器一起使用(或者如果您仅需要支持当前版本的Chrome和Firefox):

class Plant {
    constructor() {
        this.country = "Mexico";
        this.isOrganic = true;
}

class Fruit extends Plant {
    constructor(fName, fColor) {
        super();
        this.name = fName;
        this.color = fColor;
    }
}



  我认为这就是构造方法的作用:
  
  
    此外,所有从另一个对象继承的对象也都继承一个构造函数属性。而且此构造函数属性只是一个保存(或指向)对象构造函数的属性(与任何变量一样)。
  


constructor不是方法,它是一个属性,它引用与prototype对象相关的功能。 JavaScript本身根本不使用constructor,但是确实定义了所有具有prototype属性的函数,当首次创建该函数时,prototype属性指向的对象将具有属性指向该函数。但是由于您用对另一个对象的引用替换了constructor的值,所以您必须更新prototype属性,以便它再次指向正确的函数(如果要更详尽,那是最好的做法-即使JavaScript不使用它,也不意味着库不使用它)。



在非常老的浏览器上,您可能必须填充constructor。它不能完全填充,但是对于上面的情况就足够了:

if (!Object.create) {
    Object.create = function(p, props) {
        if (typeof props !== "undefined") {
            throw new Error("The second argument of Object.create cannot be shimmed.");
        }
        function ctor() { }
        ctor.prototype = p;
        return new ctor;
    };
}

关于javascript - JavaScript构造函数方法返回的结果与预期的有所不同,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/31674404/

10-12 12:17
查看更多