JavaScript中的原型和属性继承

我正在努力访问在子对象上设置的属性，并通过其原型上的方法访问它

var Parent = function () {
    this.getColor = function () {
        return this.color;
    };
};

var Child = function () {
    this.color = red;
};

Child.prototype = new Parent;

var Test = new Child();

console.log(Test.getColor());
=> undefined

非常感谢您的任何帮助。

以下是我的建议

function Parent(color) {

  function getColor() {
    return color;
  }

  // export public functions
  this.getColor = getColor;
}

现在来看

子项

function Child(color) {
  Parent.call(this, color);
}

Child.prototype = Object.create(Parent.prototype, {
  constructor: {value: Child}
});

让我们看看它的工作

var c = new Child("red");
c.getColor(); // "red";

---

说明：

子构造函数的重要位

确保使用
子实例的上下文调用
父
构造函数（
此
）


基于父.prototype的
设置子.prototype

Child.prototype = Object.create(Parent.prototype, {
  constructor: {value: Child}
});

Parent.prototype.getColor = function getColor() {
  return this.color;
};

您可以看到的node.js实现使用了类似的方法

这条有点复杂的线为你做了两件事。1） 它避免了不必要地调用父构造函数，2）它正确地设置了
构造函数
属性

var c = new Child("red");
c instanceof Child;  // true
c instanceof Parent; // true
c.constructor.name;  // "Child"

但是使用你的代码，你会看到

var c = new Child("red");
c instanceof Child;  // true
c instanceof Parent; // true
c.constructor.name;  // "Parent"

这可能是您关心的问题，也可能不是您关心的问题，但根据您希望如何使用父/子对象，可能很难通过编程区分哪些对象来自
父
构造函数，哪些对象来自
子
构造函数


好的，让我们看看另一种方法，在对象本身上指定
color
属性

function Parent(color) {
  this.color = color;
}

我们将把
getColor
方法直接添加到
Parent.prototype

Child.prototype = Object.create(Parent.prototype, {
  constructor: {value: Child}
});

Parent.prototype.getColor = function getColor() {
  return this.color;
};

子构造函数将保持不变。请记住，我们将使用上面使用的相同继承模式

function Child(color) {
  Parent.call(this, color);
}

Child.prototype = Object.create(Parent.prototype, {
  constructor: {value: Child}
});

最后，让我们使用
getColor
方法获取颜色

var c = new Child("red");
c.getColor(); // "red"

或者您可以直接访问对象上的属性

c.color; // "red"

只要定义了
red
。@adeneo您的版本在
red
：）@Pointy周围有引号-我假设它是一个变量，可能是
未定义的。如果它没有被声明，那将是一个错误。是的，我认为这就是OP版本中未定义的
的来源；赋值将
this.color
保留为
undefined
@Pointy-似乎是该结果的唯一可能方式，因此答案是声明了
red
，但它没有值，因此，
未定义
否。这条有点复杂的行的主要原因是使用
对象。创建
从父级
的原型继承而不调用构造函数。
Object.create
的第二个参数可以省略，并用一个简单的属性赋值来替换。@Bergi，“主要原因”除外，它客观上有两个作用，谢谢你说出了我没有提到的一个。我编辑了我的帖子，把我的观点置之不理：）你知道你并没有真正回答这个问题，对吗？不管是否有更好的方法来建立继承——如果OP不了解他/她当前的代码在做什么以及为什么它不起作用，仅仅向他/她抛出其他模式并没有真正的帮助。我必须承认Stephen是对的（尽管“琐碎”已经在评论中得到了解决），但是，对于正确的继承权，我们有一个+1:-）很公平，先生们。我添加了一个替代解决方案，它显示了如何将值设置为对象本身的属性。谢谢你的建设性反馈。