자바스크립트 파일에서 다른 자바스크립트 파일 불러오기

개요

자바스크립트에서 다른 자바스크립트 파일을 불러오는 방법은 여러 가지가 있습니다. 이 글에서는 그 중 몇 가지 주요 방법에 대해 자세히 설명합니다.

HTML에서 직접 불러오기

HTML 파일 내부에 <script> 태그를 사용하여 여러 자바스크립트 파일을 차례대로 불러올 수 있습니다.

<script src="file1.js"></script>
<script src="file2.js"></script>

동적으로 불러오기

자바스크립트를 사용해 동적으로 다른 자바스크립트 파일을 불러올 수 있습니다. 다음은 createElement 메서드를 사용한 예시입니다.

var script = document.createElement('script');
script.src = 'file2.js';
document.head.appendChild(script);

ES6 모듈 사용하기

ES6부터는 import와 export 키워드를 사용하여 모듈을 불러오거나 내보낼 수 있습니다.

// file2.js에서 함수 불러오기
import { myFunction } from 'file2';

CommonJS 사용하기

Node.js 환경에서는 CommonJS 방식을 사용하여 모듈을 불러올 수 있습니다.

const myModule = require('myModule');

요약

자바스크립트에서 다른 자바스크립트 파일을 불러오는 방법은 여러 가지가 있고, 상황에 따라 적절한 방법을 선택해야 합니다. HTML에서 직접 불러오는 방법은 간단하며, 동적으로 불러오는 방법은 런타임에 필요한 파일만 불러오게 할 수 있습니다. 또한 ES6 모듈과 CommonJS는 코드의 재사용성을 높여 줍니다.