Skip to content

JS/SevelteKit

import {posts} vs import posts

Author
siwon
Date
2024-01-10 13:15
Views
410

`import { posts }`과 `import posts`는 JavaScript의 모듈 시스템에서 다른 형태의 가져오기(import) 구문입니다. 이 두 구문은 모듈에서 내보낸 항목(exported item)을 가져오는 방법에 차이가 있습니다.


1. **`import { posts }`:**

   - 중괄호 `{}`를 사용하여 명시적으로 특정 항목(변수, 함수, 클래스 등)을 가져옵니다.

   - `posts`는 해당 모듈에서 내보낸 `posts`라는 이름의 변수, 함수, 또는 클래스여야 합니다.

   - 예를 들어, 모듈에서 `export const posts = [...]`와 같이 특정 변수를 내보냈다면, 이를 가져올 때 중괄호를 사용하여 명시적으로 가져올 수 있습니다.


     ```javascript

     // 모듈에서 내보내기
     // module.js
     export const posts = [...];
     // 가져오기
     // 다른 파일에서
     import { posts } from './module';

     ```


2. **`import posts`:**

   - 중괄호를 사용하지 않고 모듈에서 기본으로 내보낸(default export) 항목을 가져옵니다.

   - 모듈에서 `export default posts`와 같이 기본으로 내보낸 항목이어야 합니다.

   - 해당 모듈에서는 하나의 항목만 기본으로 내보낼 수 있습니다.


     ```javascript

     // 모듈에서 내보내기
     // module.js
     const posts = [...];
     export default posts;
     // 가져오기
     // 다른 파일에서
     import posts from './module';

     ```

따라서 사용하는 모듈의 내보내기 방식에 따라 `import` 구문을 적절하게 선택해야 합니다. 간단한 변수나 함수 등을 내보낼 때는 `{}`를 사용하는 것이 일반적이며, 모듈 전체를 기본으로 내보낼 때는 중괄호 없이 가져올 수 있습니다.