3. import & export | Notion

import / export를 통해 외부 파일을 모듈화할 수 있다.
ex) 상품 데이터 사용하는 부분의 코드가 너무 길어 다른 파일로 저장한 후 사용한다.

[1. 파일 분리하기]

하나하나의 상품 정보를 오브젝트 파일에 담았다.

[Data.js]

[
  {
    id : 0,
    title : "White and Black",
    content : "Born in France",
    price : 120000
  },

  {
    id : 1,
    title : "Red Knit",
    content : "Born in Seoul",
    price : 110000
  },

  {
    id : 2,
    title : "Grey Yordan",
    content : "Born in the States",
    price : 130000
  }
]

[2. export를 통해 데이터 보내기]

data.js에서 원하는 데이터를 export 한다.
App.js에서는 data.js를 import 한다.

export default + import

export default 문법
- [data.js 파일]
```
var 중요데이터 = 'Kim';
export default 중요데이터;
```
  - 변수명, 함수명, 자료형 전부 export할 수 있다. 다만 파일마다 한번만 사용할 수 있다.
import 문법
- [App.js 파일]
```
import 중요데이터 from './data.js';
```
  - 변수명, 함수명, 자료형 전부 export할 수 있다. 다만 파일마다 한번만 사용할 수 있다.

export {} + import

export {} 문법
- 여러개의 변수들을 내보낼 때는 export {}
```
var name1 = 'Kim';
var name2 = 'Park';
export { name1, name2 }
```
import {} 문법
- export {}로 내보낸 변수들을 사용하려면 import {} 문법을 사용한다.
  - [App.js 파일]
```
import { name1, name2 } from './data.js';
```
    - 이 때는 변수를 그대로 받아와야 한다.