W3C에 DOM 엘리먼트의 id가 글로벌 변수가 되는 사양이 있다고 합니다.
즉,

<div id="hoge"></div>

그렇다면

window.hoge === document.getElementById("hoge")

true입니다.

거기까지는 좋다고, 그 후의 거동이 다른 브라우저와 Safari에서 달랐습니다.

다시

<div id="hoge"></div>

때,

const hoge = "yeah!";
console.log(hoge);

Chrome, FireFox 등은 "yeah!"라고 표시 할 수 있지만,
Safari에서는 const에서 이중 선언하는 것과 같은 오류가 발생합니다.

사양에 없기 때문인가, Safari의 버그인가…
이것을 알고 우울하게 id를 명명할 수 없게 되었습니다…

추가 (2019/06/21)

Safari가 수정했습니다.

사양에 없기 때문인가, Safari의 버그인가…

분명히 버그였던 것 같습니다.
id와 같은 이름의 변수를 선언해도 오류가 발생하지 않습니다.

예를 들어,

const hoge = 1
console.log(hoge)

그래도 오류가 발생하지 않고,

1

제대로 돌아옵니다

여담

그럼 이렇게합시다.

console.log(hoge)
const hoge = 1
console.log(hoge)

Uncaught ReferenceError: Cannot access 'hoge' before initialization

이상하게도 제대로 오류가 발생합니다 (Safari, Chrome, Firefox 모두 동일한 동작입니다)
같은 이름의 변수가 선언되고 있는 프로그램내에서는 명시적으로 window.hoge 그리고 하지 않으면 호출할 수 없게 되는 것 같습니다

( 괴로워 혼란의 대응으로 보입니다……? )

또한 여담

window 객체의 속성을 찾고 있었지만 hoge는 찾지 못했습니다.
바로 아래에 없다면 __proto__? prototype? document 아래? 등으로 찾고 있어도 볼 수 없습니다.
도대체 어디에 저장되어 있는 것일까요?