질문이 있습니다!

전체 영역에 클릭을 받을 경우, window에 하셔도 됩니다. 여러 코드들을 보면 window에 하는 경우가 더 많은 것 같아요.
window에 하거나, 아니면 전체를 감싸고 있는 컨테이너 역할을 해주는 div 요소 등이 있다면 그 요소에 해주셔도 좋습니다.

이벤트핸들러는
따로 함수로 만들어 두고 그걸 지정해주느냐, 아니면 그 자리에 직접 함수를 넣어주느냐 그 차이인데요,
상황에 따라 두가지 모두 자주 사용합니다.

1)
function foo() {}
window.addEventListener('click', foo);

2)
window.addEventListener('click', function () {});

이벤트핸들러 함수를 따로 만들어 놓는 경우는
이벤트가 발생하지 않았을 때에도 foo(); 이런 식으로 필요에 따라 실행할 수 있고, 이벤트 바인딩을 제거할 수도 있는 장점이 있습니다.
딱 이벤트가 발생했을 때만 실행할 것이고 따로 그대로 계속 이벤트 바인딩을 유지해줄거라면 두번째 경우처럼 바로 함수를 넣어주셔도 되고요.

코딩 스타일이나 규칙에도 영향을 받는 것이라서 꼭 이렇게해야한다 이런 것은 없고요, 상황에 맞추어 사용하시면 되겠습니다^^