Question

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]?

我认为这就是构造函数方法的作用：

此外，从另一个对象继承的所有对象也继承构造函数属性。此构造函数属性只是一个属性（如任何变量），它保存或指向对象的构造函数。

Answer 1

该代码存在两个问题：

使用new Plant()创建Fruit.prototype是一种令人遗憾的常见反模式;相反，请使用Object.create并在Plant内拨打Fruit。它在您的特定代码中并不重要，但如果您想从Fruit派生某些内容，或者您想让country成为Plant的参数，那就很重要。< / p>
如果您希望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的值，您必须更新constructor属性，以便它再次指向正确的函数（如果您想要彻底，这是最好的 - 尽管 JavaScript 不使用它，但这并不意味着库不使用它。）

在非常旧的浏览器上，您可能需要填充Object.create。它不能完全填充，但它足以满足上述要求：

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构造函数方法返回与预期不同的东西

1 个答案: