export, named와 default

export란?

javascript 모듈에서 함수, 객체, 원시값을 내보낼 때 사용한다. 내보낸 값은 다른 프로그램에서 import 문으로 가져가 사용할 수 있다.

• 내보내는 모듈은 "use strict"의 존재 유무와 상관없이 무조건 엄격 모드
• export 문은 HTML 안에 작성한 스크립트에선 사용 불가

<구문>
(1) 하나씩 내보내기

export function 함수이름(){}
export const name = ...;

(2) 목록으로 내보내기

export {name1,...,nameN};

(3) 비구조화로 내보내기

export const { name1 : bar } =o;

(4) 기본 내보내기

export default expression;
export default function (…) { … }
export { name1 as default, … };

(5) 모듈 조합

export * from …;
export { default } from …;

export의 종류

(1) named

• 모듈 하나에 여러 개 존재 가능
• 여러 값을 내보낼 때 유용
• import 시 export 한 이름과 동일한 이름을 사용

예시

// 선언한 식별자 내보내기
export { func, var };

// 각각의 식별자 내보내기(변수, 상수, 함수, 클래스)
export const var = ...;
export function func() { ... };

(2) default

• 모듈 하나에 하나만 가능
• import 시 export 한 이름과 관계없이 어떤 이름으로도 가져올 수 있음
• 단일 값을 내보낼 때 사용

예시

// test.js
const k = 5; export default k;

// app.js
import m from './test'; -> k라고 import 안해도 무방

exports란?

모듈에서 함수, 객체,원시값을 객체의 형태로 내보낼 때 사용

exports default란?

분리되어 있는 파일 내 내보낼 하나의 고정된 값만 내보낼 때 사용

출처: MDN