javascript - setting the prototype of a function using object.create() -

i'm looking @ at 2 examples mdn inheritance , prototypes. there seems conflict in understanding given these 2 examples—they seem contradictory:

var = {a: 1}; //inheritance looks like: ---> object.prototype ---> null var b = object.create(a); //inheritance looks like: b ---> ---> object.prototype ---> null console.log(b.a); // 1 (inherited) 

makes sense far, on page, learning .call() method:

function product(name, price) {   this.name = name;   this.price = price;    if (price < 0) {     throw rangeerror('cannot create product ' +                       this.name + ' negative price');   }    return this; }  function food(name, price) {   product.call(this, name, price);   this.category = 'food'; }  food.prototype = object.create(product.prototype);  function toy(name, price) {   product.call(this, name, price);   this.category = 'toy'; }  toy.prototype = object.create(product.prototype);  var cheese = new food('feta', 5); var fun = new toy('robot', 40); 

isn't food's prototype going product's prototype? i.e function.prototype?

i expecting:

food.prototype = object.create(product) 

does have fact it's function?

thanks,

you seem have misunderstanding of second example. in particular, think may have confusion between "constructor" , "prototype". i'll try explain going through example.

first of all, example declares function, product. ordinary function, fact references this suggests it's intended used constructor. note return this statement superfluous, function's return value ignored when invoked constructor (ie new).

product object - it's function, , functions objects. objects have prototype, different product.prototype - can access object.getprototypeof(product), , you'll find equal function.prototype. objects have contructor, can obtained product.constructor. since product function, constructor function. constructor function.

then, what's prototype attribute? not objects have - functions do. it's not prototype of product itself. it's prototype of objects created via new product(name,price) (ie, object.getprototypeof(new product(name,price)) == product.prototype). if want think of product class, class's prototype product.prototype. , what's constructor of product.prototype? it's easy confirm product.prototype.constructor == product.

so, happen if did food.prototype = object.create(product), instead of food.prototype = object.create(product.prototype)?

1. object.create(product)' creates new object , sets prototype toproduct. can verify thatobject.getprototypeof(object.create(product)) == product`.
2. then set food.prototype new object.
3. now, when call var cheese = new food('feta', 5), you're invoking food constructor. thus, new object created, , food.prototype set prototype, ie new object's prototype object prototype product.
4. next, food called new object this argument. food passes this argument on product. far, good, right?
5. here's catch. you'll find food.constructor == function. huh? happened product? well, prototype chain reaches product, sure, , prototype of product function.prototype, , along chain constructor overridden.

so... in weird way, looks though cheese function? well, it's not (you can't call it, example), won't inherit attributes or methods put in product.prototype (though inherit ones put in product). bad thing inherit methods defined in function - example, call method itself. worse, trying use (eg cheese.call({})) raise error, since cheese not function.

thus, correct way use food.prototype = object.create(product.prototype) (or equivalently, food.prototype = new product).

---

the key point here product.prototype not prototype of product. rather, it's prototype of new objects created invoking new product(...).