개발공부/무엇인가요 시리즈3 Javascript에서의 모듈 시스템이 무엇인가요? Javascript 모듈 시스템모듈(module)은 어플리케이션을 구성하는 개별적 요소로서 재사용 가능한 코드 조각을 의미한다.보통 모듈은 기능을 기준으로 파일 단위로 분리한다. 이때 모듈이 성립하려면 모듈은 자신만의 파일 스코프(모듈 스코프)를 가질 수 있어야 한다.자신만의 파일 스코프를 갖는 모듈의 모든 자산(변수, 함수 등)은 기본적으로 비공개 상태이다.즉, 캡슐화가 되어있어서 다른 모듈에서 접근할 수 없다.모듈은 개별적인 존재로서 애플리케이션과 분리되어 존재한다.하지만 애플리케이션에서 사용할 수 없는 모듈은 의미가 없기 때문에,모듈은 공개가 필요한 자산에 한정하여 명시적으로 선택적 공개가 가능하다. === export 라고 한다.이렇게 공개(export)한 모듈의 자산은 다른 모듈에서 재사용 할 .. 2024. 5. 25. [무엇인가요 시리즈] JSConf: Inside of loop // 1번...document.body.appendChild(el)el.style.display = "none"// 2번...el.style.display = "none"document.body.appendChild(el)1번에서 우리는 el이 dom에 append 되고 style을 바꾸면 혹시나 사용자에게 보일까봐 2번처럼 바꾼다.실제 그렇지는 않지만.이벤트 루프 덕분에 1번처럼 코드를 작성해도 style을 바꾸는 코드와 append하는 코드는 서로 "경합"상태가 아니다. 어떻게 이런게 가능할까? 웹페이지에는 메인 스레드가 있다. 보통 코드가 실행될 떄는 코드가 경합될 일이 거의 없지만 메인 스레드가 처리되는 시간이 길어지면(Promise) UI UX는 blocking되는 상태로 보인다. 싱글 스레드 .. 2024. 5. 25. webpack이 무엇인가요? 정의Webpack Document 첫줄에 이렇게 안내하고있다. webpack은 Javascript 애플리케이션을 위한 정적 모듈 번들러 이다.모듈Javascript는 ES6, CJS와 같은 모듈 시스템이 존재하는데, 핵심은 코드의 스코프를 나눠 파일 단위로 관리한다. 이다.번들러"번들" 이라는 것은 무엇을 하나로 묶는 작업이다. XXX 번들러 라고 한다면 XXX 를 하나로 묶는 도구를 말한다. 따라서 Webpack을 풀어쓰면파일 단위로 나뉜 Javascript 코드를 하나의 파일로 묶는 도구 라고 할 수 있다. 여기엔 Javascript 파일 뿐만 아니라 CSS, Image, HTML 파일도 포함이다. 과거 Single Page Application 아닌 여러 HTML 파일로 이루어진 페이지 에서는 각 .. 2024. 5. 25. 이전 1 다음
