__proto__, when will it be gone? Alternatives?

Question

Mozilla claimed it would remove __proto__ a while back (~2008) and it is still in the browser. Is it still going to be deprecated? It works in Opera, (Safari I think) and Ch

Answer 1

I don't see how:

var a = {};
a.__proto__ = A; // A is object because no constructor is needed

Is simpler than:

var a = new A(); // A is Constructor function

Now setting up A in the latter case can be more verbose if you don't need a constructor function, but in that case you could automate it to be just as simple:

var A = Constructor({
    method: function(){}
}); // A is function, meant to be used with new

Compared to:

var A = {
    method: function(){}
}; //A is object, meant to be set as __proto__

And if you need some initialization logic, it will probably end up being easier just to use the normal way where the constructor function needs to be declared anyway

Answer 2

I think the actual point Mozilla wanted to make is that it's nonstandard, so the implementors would be perfectly within their rights removing it.

The cleaner way to do prototype chains is Object.create. The equivalent of your code, to create an object a with the prototype {'a': 'test'}, is:

a = Object.create({'a':'test'})

There are also shims to mimic this function in browsers that don't support it, if you ever need to work with one, which is another advantage over directly messing around with __proto__.

Answer 3

Note: It's considered a bad practice to change the value of __proto__. Doing so is strongly discouraged by Brendan Eich, the creator of JavaScript, amongst others. In fact the __proto__ property has been removed entirely from a few JavaScript engines like Rhino. If you wish to know why then read the following comment by Brendan Eich.

Update: Browsers are not going to remove the __proto__ property. In fact, ECMAScript Harmony has now standardized both the __proto__ property and the setPrototypeOf function. The __proto__ property is only supported for legacy reasons. You are strongly advised to use setPrototypeOf and getPrototypeOf instead of __proto__.

Warning: Although setPrototypeOf is now a standard, you are still discouraged from using it because mutating the prototype of an object invariably kills optimizations and makes your code slower. In addition, the use of setPrototypeOf is usually an indication of poor quality code.

---

You don't need to worry about your existing code not working one day. The __proto__ property is here to stay.

Now, for the question at hand. We want to do something similar to this in a standards compliant way:

var a = {
    b: "ok"
};

a.__proto__ = {
    a: "test"
};

alert(a.a); // alerts test
alert(a.b); // alerts ok

Obviously you can't use Object.create to achieve this end since we are not creating a new object. We are just trying to change the internal [[proto]] property of the given object. The problem is that it's not possible to change the internal [[proto]] property of an object once it's created (except via using __proto__ which we are trying to avoid).

So to solve this problem I wrote a simple function (note that it works for all objects except for functions):

function setPrototypeOf(obj, proto) {
    var result  = Object.create(proto);
    var names   = Object.getOwnPropertyNames(obj);
    var getProp = Object.getOwnPropertyDescriptor;
    var setProp = Object.defineProperty;
    var length  = names.length;
    var index   = 0;

    while (index < length) {
        var name = names[index++];
        setProp(result, name, getProp(obj, name));
    }

    return result;
}

So we can now change the prototype of any object after it's created as follows (note that we are not actually changing the internal [[proto]] property of the object but instead creating a new object with the same properties as the given object and which inherits from the given prototype):

var a = {
    b: "ok"
};

a = setPrototypeOf(a, {
    a: "test"
});

alert(a.a); // alerts test
alert(a.b); // alerts ok

<script>
function setPrototypeOf(obj, proto) {
    var result  = Object.create(proto);
    var names   = Object.getOwnPropertyNames(obj);
    var getProp = Object.getOwnPropertyDescriptor;
    var setProp = Object.defineProperty;
    var length  = names.length;
    var index   = 0;

    while (index < length) {
        var name = names[index++];
        setProp(result, name, getProp(obj, name));
    }

    return result;
}
</script>

Simple and efficient (and we didn't use the __proto__ property).