[[Class]] property in JavaScript objects

Question

The [[Class]] property of object is set according to how an object is created IIUC.

Is this why some objects are rendered to the Chrome console in a meaningful way e.g. MyFoo and others are simply rendered as Object?

With the new object literal syntax in ES6 for configuring the prototype chain. Can I modify the [[Class]] property of the resulting object, so that it is rendered in a more meaningful way to the console?

var x = { __proto__: MyCtor.prototype };
console.log(x); // I want something like MyCtor to be logged to the console

I note that in Safari 8 on a Mac the above renders MyCtor to the console. Chrome on the Mac does not.

PS: perhaps this is due to my confusing of browsers that support this prototype chain initialization syntax.

No, afaik the `[[Class]]` has never affected how `console.log` displays objects. — Bergi, Mar 03 '15 at 12:21

score 3 · Answer 1 · answered Mar 03 '15 at 11:16

Can I modify the [[Class]] property of the resulting object

Well, there is a trick here. The internal property [[Class]] has been removed in ES-6. But, the only way to get the value from [[Class]] was the Object.prototype.toString.call method. Now, you can customize that to return whatever name you want. Quoting the draft version of ECMA Script 6,

Let tag be Get (O, @@toStringTag).

ReturnIfAbrupt(tag).

If Type(tag) is not String, let tag be builtinTag.

Return the String that is the result of concatenating "[object ", tag, and "]".

So, if we can change the @@toStringTag, we can actually change result of Object.prototype.toString.call. We change it like this

var obj = {};

Object.defineProperty(obj, Symbol.toStringTag, {
    get: function() {
        return "MyClass";
    }
});

console.log(Object.prototype.toString.call(obj));
# [object MyClass]

Note: The above seen program is tested in iojs (v1.0.2 with --harmony flags enabled).

With computed properties, this can even be simplified to `var obj = {[Symbol.toStringTag]: "MyClass"};`. — Felix Kling, Mar 03 '15 at 16:18

score 2 · Accepted Answer · answered Mar 03 '15 at 11:04

2

There is no [[Class]] in ES6, there are intrinsic objects.

answered Mar 03 '15 at 11:04

elclanrs

92,861
21
134
171

[[Class]] property in JavaScript objects

2 Answers2