Why does console.log not trigger proxy getter trap?

Question

I have following code:

let p = new Proxy([1, 2, 3], {   
  get: function() {   
    console.log('get')   
  }   
})
console.log(p)

I think Proxy should proxy everything about [1,2,3].

When I log value, it should read value from [1,2,3], so the getter should be triggered.

But when I set a breakpoint in the getter, the breakpoint is not hit?

Why don't console.log and console.table trigger the getter function?

Answer 1

That's because you are logging the Proxy object itself.
The browser console has access to its internal state, which is an Object with two or three internal properties: [[target]], [[handler]] and [[IsRevoked]].

You may note that Chrome does by default expands the [[target]] in its collapsed message:

while Firefox choose to expose only the Proxy object by default _{(and doesn't expose an [[isRevoked]] internal, they set <target> and <handler> to null to signal revoked Proxies).}

So as to how they are able to not trigger the trap, well they take the internal [[target]] shortcut and access directly to the original Object.