Extending Object's prototype has weird behavior in Chrome
-
04-07-2021 - |
문제
Can anyone please explain why this code behaves so weird under Google Chrome:
<script>
console.log({someproperty:'hello'}) ;
Object.prototype.get = function(){} ;
</script>
The content of the object printed in the console has no "someproperty", instead it has a "get someproperty" which is a function.
I'm using Chrome 21.0.
Is this expected? Is it a bug?
해결책
I can't explain to you why setting Object.prototype.get to something different causes such odd behavior, except that that function is almost certainly what Chrome/Webkit is using behind the scenes to generate its fancy object logging.
I can tell you that the reason it's happening even though you're setting .get after the console.log is that Chrome/Webkit doesn't retrieve the object until you actually click the arrow in the console to expand the object. You can test this by running this jsfiddle: http://jsfiddle.net/BNjWZ/
Notice that if you click the arrow to expand the object right away, the object will look normal, but if you wait three seconds for the .get = function(){}; to be called, it will have the 'get's.
I'm seeing this behavior (both the odd 'get' in the object display and the delayed object logging) in 22.0.1229.79
다른 팁
It is not expected. There is no restriction in the spec as to the name of a property. So 'get' is a legal name for a property of an object, and the prototype object, for that matter.
It seems to be a bug in the global dir() function of the console.
Addition: JQuery has a problem with 'get' and 'set' properties.