简体   繁体   中英

JavaScript prototypal inheritance to show parent object name

I've been reading about JavaScript prototypal inheritance and the prototype property, and I started making a fiddle to understand the concepts better. But I need help understanding why my example isn't working as I thought it would.

In the following example, I'm trying to create a hierarchy where when you create an object, it tells you the name of the parent object. However, my logs always return "object".

One article explained that prototype chaining works so that if a property is not found on the object, the prototype of the parent is checked, and it keeps going up until 'Object', and if not found returns undefined.

Here's a fiddle to go along: http://jsfiddle.net/hqozqd0m/

 Object.prototype.cname = 'object'; function plant() { function parentname() { return this.cname; } return { parentname:parentname } } plant.prototype.cname = 'plant'; function tomato() { function parentname() { return this.cname; } return { parentname:parentname } } tomato.prototype = new plant(); // <-- settings it to plant as parent var p = new plant(); var t = new tomato(); console.log(p.parentname()); //object console.log(t.parentname()); //object 


updated code - same result

Object.prototype.cname = 'object';

function plant() {
    this.sayparentname = function() { console.log(cname); };
}
plant.prototype.cname = 'plant';

function tomato() { 
    this.sayparentname = function() { console.log(cname); };
}
tomato.prototype = new plant();

var p = new plant();
var t = new tomato();

p.sayparentname();
t.sayparentname();

Normally a constructor function will modify the object that new creates, with statements such as this.foo = bar , and not return anything. Then the result of the new expression is the object.

However, if the function returns an object, that object will replace the one that new created; so when you use new plant() you're just getting a plain Object instance back.

To fix your code you just need to make it like this:

function Plant() {
    function parentName() { return this.cname; }

    this.parentName = parentName;
}

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM