Why cannot I use prototype in Object Literals in javascript?

Question

Well I am curios to learn about prototypes in javascript and found many articles however i am not able to understand why am i not able to use prototypes in Object literals in javascript. As we all know, everything is inherited from Object so in that case

function Dog() {
}

Dog.prototype = new Animal;
Dog.prototype.bark = function() {
    console.log("Woof! My name is " + this.name);
};

If I am able to use prototype in the function why am i not able to use prototype in the object literals for instance the below example

 var obj = {
            firstname: 'foo',
            lastname:'bar'
        }
        // this throws an error
        obj.prototype.getMethod = function () {
            console.log('this is a function');
        }

I have gone through all this question but it really doesnt answer the reason why cant use prototype in the object literals in javascript. Below are some of the references

refrence 1

refrence 2

refrence 3

Have you checked http://stackoverflow.com/questions/3452414/adding-a-prototype-to-an-object-literal ...? — Vinita Rathore, Dec 14 '16 at 12:59

Rajaprabhu Aravindasamy · Accepted Answer · 2016-12-14T13:19:27.923

4

First of all, the .prototype property belongs to function object. You cannot access it from a plain object instance. Basically the constructor-associated .prototype property will be used when constructing the internal [[prototype]] of an instance. Here you are having an instance, if you want to add the function to the prototype chain of it, then you have to modify it by

var obj = { firstname: 'foo', lastname:'bar' };
var pro = Object.getPrototypeOf(obj);
pro.getMethod = function () {
  console.log('this is a function');
};

As @bergi pointed out, there is a risk of adding the getMethod to all the instances if we follow the above approach. But in order to avoid that you could alternatively do,

var obj = { firstname: 'foo', lastname:'bar' };
Object.setPrototypeOf(obj, Object.create({getMethod : function(){
  console.log("Hello");
}}));

console.log(obj.getMethod()); //"Hello"

edited Dec 14 '16 at 13:19

answered Dec 14 '16 at 12:57

Rajaprabhu Aravindasamy

66,513
17
101
130

1

every object has been inherited, right? then why are we not able to acces the prototype property in the object literals, how is the object literal so different from the function in javascript? – Lijin Durairaj Dec 14 '16 at 13:09
Notice that `pro === Object.prototype`, so you'll probably do *not* want to modify it – Bergi Dec 14 '16 at 13:10
1

@LijinJohn Because instances are very different from constructors. To clear your confusion, you'll might want to read http://stackoverflow.com/questions/9959727/proto-vs-prototype-in-javascript – Bergi Dec 14 '16 at 13:11
@Bergi Yup. getMethod will be available in all the object instances not only this one. – Rajaprabhu Aravindasamy Dec 14 '16 at 13:11
@Bergi wouldn't the newly updated approach resolves the problem that we were talking about? – Rajaprabhu Aravindasamy Dec 14 '16 at 13:20
The `Object.create` is unnecessary (you'd want something like `Object.create(Object.prototype, {getMethod:…/*descriptor*/})` if you used that), but yes `Object.setPrototypeOf` solves the problem of creating global properties on all objects – Bergi Dec 14 '16 at 15:07

score 0 · Answer 2 · answered Jul 01 '23 at 17:02

With ES2015 and later, you can use the literal __proto__ as the property name to setup the prototype right in the object literal:

const myProto = {
  propertyExists: function(name) {
    return name in this;
  },
};
const myNumbers = {
  __proto__: myProto,
  array: [1, 6, 7],
};
myNumbers.propertyExists('array'); // => true
myNumbers.propertyExists('collection'); // => false

Here is where I got the example from.

Here are details of this in the spec.

Why cannot I use prototype in Object Literals in javascript?

2 Answers2