Why console.log treats bare 'foo' as ID and not as variable?

Question

This might be a sillly question, but why the console.log(foo) treats foo as ID and not as variable?

The following code works, but I think it actually should not:

<div id="foo"></div>

<script>
  'use strict';
  console.log(foo);
</script>

And here is how it really should be (in my opinion):

<div id="foo"></div>

<script>
  'use strict';
  const foo = document.querySelector('#foo');
  console.log(foo);
</script>