JavaScript继承Object.create(）未按预期工作

JavaScript inheritance Object.create() not working as expected

本文关键字：工作 继承 Object create JavaScript      更新时间：2023-09-26

我有：

主对象

function Fruit() {
    this.type = "fruit";
}

子对象：

function Bannana() {
    this.color = "yellow";
}

继承主属性

Bannana.prototype = Object.create( Fruit.prototype );
var myBanana = new Bannana();
console.log( myBanana.type );

输出：undefined。为什么不显示"fruit"作为结果？

为什么这没有显示出"成果"作为结果？

因为您从未在新对象上设置type。

type不是Fruit.prototype的属性，而Bannana.prototype = Object.create( Fruit.prototype );所做的只是使Fruit.prototype的属性可用于每个Banana实例。

CCD_ 9由CCD_。但是，如果您查看您的代码，您在执行Fruit！this.type = "fruit";行从不执行！type属性不会神奇地出现。

因此，除了设置原型之外，还必须执行Fruit。您必须通过super调用父构造函数（就像您在其他语言（现在是ES6）中所做的那样）：

function Bannana() {
    Fruit.call(this); // equivalent to `super()` in other languages
    this.color = "yellow";
}

在新的JavaScript版本（ES6/ES2015）中，您将使用类来代替：

class Banana extends Fruit {
    constructor() {
        super();
        this.color = 'yellow;
    }
}

这做了同样的事情，但为了便于使用，将其隐藏在class语法后面。

这太酷了。如果你走这条路：

function Fruit() {
    this.type = "fruit";
}
function Bannana() {        
    this.color = "yellow";
}
Bannana.prototype =  new Fruit;
Bannana.prototype.type='flower';
var myBanana = new Bannana();
console.log( myBanana.type );

你会得到一朵"花"，但如果你走这条路：

function Fruit() {
    this.type = "fruit";
}
function Bannana() {
    Fruit.call(this);
    this.color = "yellow";
}
Bannana.prototype.type='flower';
var myBanana = new Bannana();
console.log( myBanana.type );

您将获得一个"水果"；

我认为不需要解释，对吧？

您从未在Fruit原型对象上放置任何内容。构造函数初始化实例，而不是原型。

如果你有：

Fruit.prototype.type = "fruit";

那么您的代码将如您所期望的那样工作。

相关文章：