Javascript:添加的函数未出现在父对象上

Javascript:添加的函数未出现在父对象上,javascript,prototype,Javascript,Prototype,我试图理解Javascript中的原型继承。关于这一点已经提出了几个问题,但它们似乎并没有解决我所面临的困惑 互联网上也有一些很棒的资源 当我阅读这些资源时,我认为我理解了原型继承,但是当我在浏览器控制台中尝试一些测试时,我意识到我遗漏了一些东西 基于下面的代码示例: 1为什么添加的原型功能描述在父对象动物上不可见? 2为什么添加描述函数后创建的对象现在缺少原始对象属性:名称和颜色 例如: 创建一个简单的对象 function animal(){ var name; var co

我试图理解Javascript中的原型继承。关于这一点已经提出了几个问题,但它们似乎并没有解决我所面临的困惑

互联网上也有一些很棒的资源

当我阅读这些资源时,我认为我理解了原型继承,但是当我在浏览器控制台中尝试一些测试时,我意识到我遗漏了一些东西

基于下面的代码示例: 1为什么添加的原型功能描述在父对象动物上不可见? 2为什么添加描述函数后创建的对象现在缺少原始对象属性:名称和颜色

例如:

创建一个简单的对象

function animal(){
    var name;
    var colour;
 }
基于原型动物创建两个新对象

仅向一个对象添加属性

> dog = new animal();
> dog.name = 'dog';
> dog.color = 'brown';
> dog.bite = 'hurts';

> dog
< animal {name: "dog", color: "brown", bite: "hurts"}


> animal.prototype.description = function(){
  console.log('A ' + this.name + ' is ' + this.color); }
< function (){
  console.log('A ' + this.name + ' is ' + this.color); }
添加一个新函数作为原型。这一切都如我所料

> animal
< function animal(){
   var name;
   var colour;
}


> dog
< animal {name: "dog", color: "brown", bite: "hurts", description: function}
> cat
< animal {name: "cat", color: "black", description: function}
这就是困惑。新的功能描述会出现在现有的dog和cat对象上,但不会出现在父对象animal上

从父动物创建的新对象cow现在只有描述功能,而没有名称或颜色

编辑

根据@Quince的回答,我回到了浏览器,但仍然感到困惑:

>animal = function(){
   this.name;
}
<function (){
   this.name;
}
>animal
<function (){
   this.name;
}
>cat = new animal();
<animal {}
>cat
<animal {}
在这种情况下,新对象cat似乎不会从父对象继承name属性。

在本例中

function animal(){
    var name;
    var colour;
 }
名称和颜色是动物专有的,因此无法访问

现在当你运行这个

 cat = new animal();
< animal {}
> cat.name = 'cat';
> cat.color = 'black';
animal被赋予了一个名为description的公共可访问函数,这就是为什么在创建cow时可以看到它,但实际上该函数还不会打印任何内容,因为animal类没有名称或颜色属性

你们可以选择把动物变成动物

function animal(){
    this.name;
    this.colour;
 }
虽然这样做没有其他好处,只是让您知道可以设置动物的此属性,但您仍然需要设置它们,以便“描述”打印任何内容

如果想要保持私有和公共,另一个选择是使用与显示模块模式类似的东西,该模式允许js通过在返回的对象之外声明属性来保持对象的私有属性

function Animal() {
    //private artibutes
    var name;
    var colour;
    //return publically avaliable functions/attibutes
    return {
        description: function () {
            console.log('A ' + name + ' is ' + colour);
        },

        setName: function (nameIn) {
            name = nameIn;
        },

        setColour: function (colourIn) {
            colour = colourIn;
        },
        getName: function () {
            return name;
        },

        getColour: function () {
            return colour
        }
    }
};
现在访问私有名称和颜色的唯一方法是使用这里返回的公共可用函数,这是一个小提琴,显示了它的作用


哦,我刚刚意识到我从来没有真正回答过标题中的问题,所以当你打印动物时,你看不到添加的描述函数,因为这个函数附在原型上,原始打印的动物只是一个构造器。使用新动物创造的任何东西都将继承动物原型,这就是为什么它可以在狗和牛身上看到的原因。因此,如果要继承属性,是否应将其定义为this.name;例如?是的,对不起,我刚刚更新了答案,我也会再举一个例子谢谢。。。我正在努力解决这个问题。我在这里还提出了一个改进:好的,我意识到我没有回答这个问题,所以在底部做了最后一次更新,讨论了为什么你不能在animalah上看到添加的函数,如果你将它们设置为未定义的或初始值,你会看到它们函数Animalname,color{this.name=name;this.color=color;}
 cat = new animal();
< animal {}
> cat.name = 'cat';
> cat.color = 'black';
animal.prototype.description = function(){
  console.log('A ' + this.name + ' is ' + this.color); 
}
function animal(){
    this.name;
    this.colour;
 }
function Animal() {
    //private artibutes
    var name;
    var colour;
    //return publically avaliable functions/attibutes
    return {
        description: function () {
            console.log('A ' + name + ' is ' + colour);
        },

        setName: function (nameIn) {
            name = nameIn;
        },

        setColour: function (colourIn) {
            colour = colourIn;
        },
        getName: function () {
            return name;
        },

        getColour: function () {
            return colour
        }
    }
};