[JS] $(function() {}) vs (function() {})()

$(function() {})

- jquery 구문
- DOM이 준비되었을 때 실행되는 함수를 정의한다.
- 즉, HTML 문서의 요소가 모두 로드되고 DOM이 생성된 후 실행된다.
- return 이 없어도 정상적으로 동작하며, 반환값을 활용하지 않는 것이 일반적이다.
- javascript의 DOMContentLoaded 이벤트와 유사하다.

document.addEventListener("DOMContentLoaded", function() {
	console.log("DOM이 준비되었습니다!");
});

    
*실행조건
- 브라우저가 HTML 구조를 모두 파싱한 후 실행된다.
- javascript가 DOM에 접근 가능해진 시점에서 실행된다.

(function() {})()

- javascript 구문
- 즉시실행함수
- $(function() {}) 와 달리 DOM의 상태와 상관없이 코드가 정의된 즉시 실행된다.
- 값을 반환하여 외부에서 사용할 수 있게 만드는 경우가 많으므로, return 문을 자주 사용한다.
- 이 함수는 독립적인 스코프를 생성하여 내부 변수나 코드를 외부에 노출하지 않는 데 유용하다.

const module = (function() {
	return {
		init() {
			console.log("초기 실행!“);
		}
	}
})();

module.init(); // "초기 실행!”

*실행조건
- 브라우저가 스크립트를 읽고 이 코드에 도달하는 즉시 실행된다.
- DOM이 준비되지 않아도 실행된다.

주요 차이점