import/export 사용하기

코드가 너무 길어져 다른 파일로 쪼개서 연결시키고 싶을 때 사용할 수 있는 import/export

data.js 라는 파일의 변수, 데이터 등을 App.js 로 보내려면
1. data.js에서 원하는 데이터를 export 하고
2. App.js에서 그 데이터를 import한다.

export default 문법

(data.js 파일)

var 데이터 = '가나다라';
export default 데이터;

src폴더에 App.js와 함께 data.js 파일을 만들어준 후
export default 문법을 사용하고 우측에 내보내고 싶은 변수/데이터를 적어준다(변수, 자료형, 함수명 모두 가능 + 파일마다 export default라는 키워드는 하나만 가능)

import 문법

(App.js 파일)

import 데이터 './data.js';

import 변수명 from "경로" 를 해준다.
변수명은 자유롭게 가능하고,
./ 는 "현재경로"를 의미한다.

---

여러개의 변수를 내보내고 싶을 땐 export{ } 문법

(data.js 파일)

var 데이터1 = '가나다';
var 데이터2 = '아자차';
export { name1, name2 }

아까의 경우와는 달리 변수나 함수명이 있어야 한다.

import { } 문법

(App.js 파일)

import { 데이터1, 데이터2 } from './data.js';

export 했던 변수명을 원하는 것만 골라서 써주면 된다.

이전과 달리 작명 불가능하고 export한 변수명 그대로 사용해야 한다.