Javascript window.document in console

Question

In javascript, when I access the window through the Chrome console, and then go to the document property, I get an object with many kinds of properties:

But when I access a document like this window.document in the console, I get another object:

The latter looks like a DOM API, which we can use to control HTML.

Question:

Why do we get different document objects when accessing the document object in the above ways?