0

If I declare a non-derived class, the console log shows the class name of instances:

class A {constructor(){}}
new A();
-> A {}

However, when I declare a derived class, the console log shows the parent class name instead:

class B extends EventTarget {constructor(){super();}}
new B();
-> EventTarget {}

This seems to happen in every browser I tried (Chrome, Firefox, very old, very new).

Can the derived class be declared in a way that the class name appears in the console log?

personal_cloud
  • 3,943
  • 3
  • 28
  • 38
  • 2
    What version of Chrome are you using? I just tried this on 110.0.5481.177 and it works fine. – Michael M. Apr 17 '23 at 01:49
  • @Michael M. Good observation. It also works fine in Chrome 111 and Edge 112. The problems are in Chrome 66 and Firefox 88. (I intentionally use a very old Chrome to make sure I don't accidently use some too-new feature.) So is it just a coincidence that both Chrome and Firefox have had the same bug? Or did something change in the language? – personal_cloud Apr 17 '23 at 01:57
  • Or you should just use something like babel if you are concerned with old browser support.... – epascarello Apr 17 '23 at 01:59
  • @epascarello OP's asking about the console, so I don't think babel will be much of a help there. – Michael M. Apr 17 '23 at 02:11
  • 1
    I don't think the JavaScript specification says anything about how objects are displayed in the console. It might be a coincidence. Or since both are open source, maybe there was some copying of the initial implementation. – Barmar Apr 17 '23 at 04:25
  • 1
    @MichaelM. That comment was for the fact they are using an old browser to ensure the code they write works with old browsers. – epascarello Apr 17 '23 at 12:12
  • 1
    And I highly doubt there is going to be be anything one can do different to how older browsers display things in the console. – epascarello Apr 17 '23 at 12:20
  • @Barmar OK, so you're saying that it's a bug-like undesirable behavior (perhaps not technically a bug per language specs) perhaps coming from some common reference implementation. So is the best workaround to use newer browsers for debugging? – personal_cloud Apr 17 '23 at 19:27
  • 1
    Either that, or write your own debugging code if you need to test the code in older browsers. – Barmar Apr 17 '23 at 19:28
  • @Barmar Supposing we want the log to look reasonable in an older browser; I wonder what is the best way to make the object type clear when it is printed. The challenge is that I can pass the object to somebody else who can print it. – personal_cloud Apr 17 '23 at 19:32
  • 1
    Why do you care how it looks? The console is just for debugging, it's not expected to be visible to users. But like I said, if you care how it looks, write your own formatting code. – Barmar Apr 17 '23 at 19:33
  • @personal_cloud `console` is not part of the language but of the devtools/debugger. The representation of objects is meant to be useful in the first place, and it uses various heuristics for what names to display, as they are usually not part of the javascript object itself. Being buggy in the presence of builtins like `EventEmitter`, which on top is an interface and might internally be implemented as a mixin, is not unlikely. – Bergi Apr 17 '23 at 21:18

0 Answers0