what is javascript prototype?

Question

I am a bit curious about javascript prototype I found sample in here and I made little modification so I can try it like this:

<html>
<body>
    <script>
        function Product(name, price) {
            this.name = name;
            this.price = price;
        }

        function Food(name, price) {
            Product.call(this, name, price);
            this.category = 'food';
            this.otherName = name;
        }
        Food.prototype = new Product();

        function Toy(name, price) {
            Product.call(this, name, price);
            this.category = 'toy';
        }
        Toy.prototype = new Product();

        var cheese = new Food('feta', 5);
        var fun = new Toy('robot', 40);
        var prod = new Product('test', 20);
        console.log(cheese);
        console.log(fun);
        console.log(prod);
    </script>
</body>
</html>

and it returns like this

cheese = Food {name: "feta", price: 5, category: "food", otherName: "feta", name: undefined, price: undefined}
fun = Toy {name: "robot", price: 40, category: "toy", name: undefined, price: undefined}
prod = Product {name: "test", price: 20}

its make property name and price twice, is it more efficient if we distinguish Food.prototype = new Product(); and Toy.prototype = new Product();

Why must I use that line?

I don't understand the question. But instead of using `.protoype = new Foo()` you should use `Object.create` to set up inheritance. Have a look at http://stackoverflow.com/q/17392857/218196. — Felix Kling, Sep 16 '13 at 08:36
I think that's a mistake in the article. Doing `Food.prototype = new Product();` seems to be pointless. — freakish, Sep 16 '13 at 08:37
@simonzack In that article `Product.call` is used to demonstrate constructor chaining. `Food.prototype = new Product();` is confusing in that context imho. — freakish, Sep 16 '13 at 09:35

score 3 · Answer 1 · answered Sep 16 '13 at 08:36

Every JavaScript object has a second JavaScript object (or null, but this is rare) associated with it. This second object is known as a prototype, and the first object inherits properties from the prototype.

All objects created by object literals have the same prototype object, and we can refer to this prototype object in JavaScript code as Object.prototype. Objects created using the new keyword and a constructor invocation use the value of the prototype property of the constructor function as their prototype. So the object created by new Object() inherits from Object.prototype just as the object created by {} does. Similarly, the object created by new Array() uses Array.prototype as its prototype, and the object created by new Date() uses Date.prototype as its prototype.

score 1 · Answer 2 · answered Sep 16 '13 at 08:37

Well, The prototype property allows you to add properties and methods to an object.

Sample to understand:-

<!DOCTYPE html>
<html>
<body>

<script>

function employee(name,jobtitle,born)
{
this.name=name;
this.jobtitle=jobtitle;
this.born=born;
}
var fred=new employee("Fred Flintstone","Caveman",1970);

employee.prototype.salary=null;

fred.salary=20000;

document.write(fred.salary);

</script>

</body>
</html>

In above sample we are adding one more property (salary) to the employee using prototype.

Hope this will help you...

score 0 · Answer 3 · answered Sep 16 '13 at 08:38

0

like OOP, all objects in JS are descendent of Object class, they inherit all properties from Object.prototype, while you can override them. Object can have null prototype too, i.e. Object.create(null)..

answered Sep 16 '13 at 08:38

Waqas Memon

1,247
9
22

what is javascript prototype?

3 Answers3