Get ALL property names

Question

In following code I get true meaning property someMagic is own property of obj at least in Chrome and Firefox.

But when I try to get full list of properties via getOwnPropertyNames returned array does NOT contain it in both browsers. In chrome I receive single property constructor and in FF the result is an empty array. Why?

Is it possible to get all names?

var obj = Object.getPrototypeOf(Object.getPrototypeOf(window))
console.log(obj.hasOwnProperty('someMagic'))
console.log(Object.getOwnPropertyNames(obj))

<div id="someMagic"></div>

I guess this is because the `window` object is (or inherits from) a very quirky proxy-like exotic object. It's really magic. — Bergi, Jan 16 '20 at 22:33

score 2 · Accepted Answer · edited Jun 20 '20 at 09:12

As @Bergi says in his comment, the window object is wrapped by something called WindowProxy. Exactly as he says: exotic, proxy-like (and quirky and magic :-). A little more details from the specs:

A WindowProxy is an exotic object that wraps a Window ordinary object, indirecting most operations through to the wrapped object. Each browsing context has an associated WindowProxy object. When the browsing context is navigated, the Window object wrapped by the browsing context's associated WindowProxy object is changed.

The WindowProxy exotic object must use the ordinary internal methods except where it is explicitly specified otherwise below.

That last part about using ordinary internal methods "except where...explicitly specified" is key.

In the EcmaScript 262 standard, it specifies that hasOwnProperty uses GetOwnProperty. And getOwnPropertyNames uses OwnPropertyKeys. And note that both of these are overridden in WindowProxy:

7.4.5 [[GetOwnProperty]] ( P )

7.4.10 [[OwnPropertyKeys]] ( )

So the two properties you are using above are both using overridden, non-ordinary methods, rather than the "ordinary internal methods." And hence they are giving unusual results. There is even a warning under under 7.4.5 GetOwnProperty, which warns of a "willful violation" of the specs:

This is a willful violation of the JavaScript specification's invariants of the essential internal methods to maintain compatibility with existing Web content. See tc39/ecma262 issue #672 for more information. [JAVASCRIPT]

This StackOverflow Answer gives a little more of the history of how this strange behavior became part of the HTML5 standard.

score 0 · Answer 2 · edited Jan 17 '20 at 14:25

0

You can use for in to do this

EXAMPLE:

const obj =  {
  property: 'test',
  property2: 'test2'
}

for(property in obj)
  console.log('PROPERTY', property)

RESULT CONSOLE

const obj =  {
  property: 'test',
  property2: 'test2'
}

for(property in obj)
  console.log(property)

> "property"
> "property2"

edited Jan 17 '20 at 14:25

David784

7,031
2
22
29

answered Jan 17 '20 at 00:57

Matheus Frez

324
2
7

I initially thought the same thing, but actually `for...in` doesn't work in his particular use case either. He's specifically asking about the `window` object and the quirky properties that get auto-added for elements with a `name` or `id` attribute. – David784 Jan 17 '20 at 14:27

Get ALL property names

2 Answers2