개발자

export const와 export default의 차이

2023년 04월 24일조회 1,001

안녕하세요! 기초적인 질문일 수 있지만,, 도움 요청드립니다. 혹시 export const 함수명 = () => {} 이렇게 쓰는거랑 const 함수명 = () => {} 쓰고 아래 export default 함수명; 쓰는거에 대한 차이가 있을까요?

이 질문이 도움이 되었나요?
'추천해요' 버튼을 누르면 좋은 질문이 더 많은 사람에게 노출될 수 있어요. '보충이 필요해요' 버튼을 누르면 질문자에게 질문 내용 보충을 요청하는 알림이 가요.
profile picture
익명님의 질문

답변 3

김인후님의 프로필 사진

export default를 사용할 경우는 해당 파일을 읽을 때 자동적으로 해당 함수를 호출하고 export const는 그 파일 내에서 함수를 호출해야합니다. export const a = 3 import { a } from "" const b = 3 export default b import b from ""

이재찬님의 프로필 사진

export default와 export const의 가장 큰 차이는, 모듈에서 단일 대상을 내보내느냐 여러 대상을 내보내느냐의 차이에 있습니다. default라는 명칭에 맞게, 모듈에서 “기본”으로 내보낼 수 있는 대상은 한 가지만 정의할 수 있습니다. 이건 그 모듈에서 내보내는 값 그 자체로 볼 수 있기 때문에, import A from “B”라는 코드의 형태로 작성이 가능합니다. 반면에, export const는 해당 모듈에서 “상수”를 내보내는 역할을 합니다. 내보내는 기능 자체는 가능하지만, 기본값으로 지정이 되어 있지는 않은 상태입니다. 이러한 경우에는 import { A } from “B”의 형태로 불러와서 사용이 가능합니다.

커리어리 AI 봇님의 프로필 사진

네, 두 가지 방식에는 차이가 있습니다. 1. ' export const 함수명 = () => {} ': 해당 방식은 이름이 있는 내보내기(named exports)로, 다른 파일에서 ' import { 함수명 } from '파일경로' '와 같이 불러와서 사용합니다. 2. ' const 함수명 = () => {}; export default 함수명; ': 해당 방식은 기본 내보내기(default export)로, 다른 파일에서 ' import 함수명 from '파일경로' '와 같이 불러와서 사용합니다. 이 방식은 파일당 한 개의 기본 내보내기만 가질 수 있습니다. 따라서, 이름이 있는 내보내기는 여러 개의 함수/변수를 내보낼 수 있으며, 다른 파일에서 사용할 때는 반드시 중괄호({}) 안에 내보낸 함수/변수 이름을 적어주어야 합니다. 반면 기본 내보내기는 파일당 한 개의 함수/변수만 내보낼 수 있으며, 다른 파일에서 사용할 때는 중괄호({}) 없이 이름을 적어주면 됩니다.

커리어리 AI 봇의 답변을 평가해 주세요!

지금 가입하면 모든 질문의 답변을 볼 수 있어요!

현직자들의 명쾌한 답변을 얻을 수 있어요.

또는

이미 회원이신가요?

목록으로
키워드로 질문 모아보기

실무, 커리어 고민이 있다면

새로운 질문 올리기

지금 가입하면 모든 질문의 답변을 볼 수 있어요!