2

I was wondering if there is actually a difference between using an object literal as opposed to using a prototype or if it is really just preference? I only ask because as I read it sounds as if a literal is just a better way to represent Prototypal information since, according to JavaScript: The Good Pattern, Douglas Crockford "Objects...[have] a hidden link to a prototype object. And before I get downvoted I did see this topic has come up. I'm not sure if the standard has change with ECMA6 but the answer wasn't correct. I also ask because I don't know how the Sandbox pattern would work if this wasn't the case. Thanks for taking the read!

Running this basic script appears that literals (at least when using object.create()) act similar to prototypes with the ability to over-ride a function. Having an inherited function property change at run-time if the parent function changes, assuming the function has not been over-ridden. Also, if over-riding the parent object from the child object, it has no effect on the parent object.

var my_literal = {}, my_object_create;

my_literal.calc = (function (x, y) {
    'use strict';
    return x * y;
}(1, 3));

my_object_create = Object.create(my_literal);

console.log(my_object_create.calc);
console.log(my_literal.calc);

my_literal.calc = 'Over ride';

console.log(my_object_create.calc);
console.log(my_literal.calc);

my_object_create.calc = (function (x, y) {
    'use strict';
    return x * y;
}(2, 4));

console.log(my_literal.calc);
console.log(my_object_create.calc);
Obj3ctiv3_C_88
  • 1,478
  • 1
  • 17
  • 29
  • No, ES6 did change nothing about how prototypal inheritance works. – Bergi Jul 24 '15 at 14:58
  • 2
    No, it doesn't matter whether your objects are constructed from literals or function calls or whatever, they all are objects with a hidden prototype link. – Bergi Jul 24 '15 at 14:59
  • What exactly is your question? What's your hypothesis, and how have the results from your example script verified or falsified it? What is left unclear, what did get clear? – Bergi Jul 24 '15 at 15:01
  • @nils I'm sorry, I mean the prototypal pattern in general that you typically see. Like https://carldanley.com/js-prototype-pattern/ and http://www.dofactory.com/javascript/prototype-design-pattern where you create a named function and typically use a constructor. Then Add properties using the my_literal.prototype.calc call. – Obj3ctiv3_C_88 Jul 24 '15 at 15:01
  • 1
    Both patterns can be used to create the same object setup and shapes. The advantage of constructor functions is that they are executed on instantiation and can do initialisation. – Bergi Jul 24 '15 at 15:06
  • @Obj3ctiv3_C_88 the `my_literal.prototype.calc` is only needed for the `new` operator to find the object that will become the [[prototype]] of the new object you will create (`my_object_create` in this case). If you don't use the `new` operator, you don't need it (you can still use it if you like it though). As bergi said, the actual [[prototype]] chain works on all constructed objects. – nils Jul 24 '15 at 15:06
  • @Bergi I mean using a prototypal pattern as opposed to just creating a literal. My example script was used to demonstrate that, at least with my knowledge a literal has all the capability of a prototype function. And thanks for clarification on ES6, I'm still picking up as much as I can on JS. Also, this is probably another question in an of itself but instead of overriding built in methods wouldn't it be better to create an object that inherits from the method you'd like to override, then override it. And then anytime you'd need to use new call just inherit from the created object? – Obj3ctiv3_C_88 Jul 24 '15 at 15:06
  • 1
    @Obj3ctiv3_C_88 there is a similar pattern called `OLOO` that solves that problem. Instead of overriding functionality, you create a new function with its own name on your new object and *delegate* the old behavior to the object that is in the [[prototype]] chain. More on the pattern: https://github.com/getify/You-Dont-Know-JS/blob/master/this%20&%20object%20prototypes/ch6.md – nils Jul 24 '15 at 15:11
  • @Bergi Thanks for explanation of the constructors advantage. Just playing devils advocate for clarity, couldn't you achieve this with a literal and immediate function as well? – Obj3ctiv3_C_88 Jul 24 '15 at 15:14
  • 1
    @Obj3ctiv3_C_88: Yes, you can - but it's getting more verbose. Think of `new X` as syntactic sugar for `Object.create(X.prototype).constructor()` :-) (of course it's a bit more complicated but you get the gist) – Bergi Jul 24 '15 at 15:16
  • @Bergi That is a handy little trick, I haven't seen that in any of my books or seen in a lecture. Very grateful for all your help answering my question, sorry I can't give you best answer :( – Obj3ctiv3_C_88 Jul 24 '15 at 15:21
  • @Obj3ctiv3_C_88: See also [here](http://stackoverflow.com/questions/6750880/javascript-how-does-new-work-internally) and [here](https://stackoverflow.com/questions/1744426/does-javascripts-new-operator-do-anything-but-make-life-difficult). If you insist on giving me an upvote, you may at [this](http://stackoverflow.com/a/13040858/1048572) or [that](http://stackoverflow.com/a/10898859/1048572) answer (they might be related, but focus on inheriting from constructor-based classes) – Bergi Jul 25 '15 at 13:48

0 Answers0