가져오기 / 내보내기

import : 외부에 있는 다른 자바스크립트 파일을 가져올 수 있다.
export : 내부에 있는 다른 자바스크립트 파일을 내보낼 수 있다.

- export (내보내기)

1. default export

파일을 내보낼 때 이름을 지정하지 않아도 되는 내보내기 방식이다.
단점으로 하나의 파일에서 한 개의 함수,변수등을 내보낼 수 있다.

default export 사용법

export default function () {

};

2. named export

파일을 내보낼 때 이름을 지정해줘서 내보내는 방식이다.
이렇게 이름만 지정되어 있다면, 하나의 파일에서 몇개의 함수,변수등을 내보내던지 상관이 없다.

named export 사용법

export function name1(){

};

export const name2 = { };

- import (가져오기)

1. import (default export에서 나오는 파일 가져오기)

import에 아무 이름을 입력해도 상관이 없다.

import 사용법 (default export)

import name from '가져올 js파일 위치'

2. import (named export에서 나오는 파일 가져오기)

import에 이름을 입력해 줄 때 이름을 { }로 꼭 감싸줘야 한다.
{ }안에 데이터를 변경하고 싶다면 :가 아닌 as를 사용하여 {name as firstName} 이런식으로 사용하여 변경할 수 있다.

import 사용법 (named export)

import {name} from '가져올 js파일 위치'

import {name as firstName} from '가져올 js파일 위치'

💡 한 번에 파일안에 모든 named export로 내보낸 내용을 가져오고 싶다면,
import * as name from '가져올 js파일 위치'로 *을 사용해 모든 내용을 할당해서 가져올 수 있다.