본문 바로가기
JavaScript/JavaScript

[ReactJS_Complete] Exports and Imports

by HJ0216 2023. 5. 24.

이 글은 [[한글자막] React 완벽 가이드 with Redux, Next.js, TypeScript]를 수강하며 정리한 글입니다.

 

 

⚛️ 기본 환경: IDE: VS code, Language: React

 

 

export: 내보내기

🚨 클래스나 함수를 내보낼 땐 세미콜론을 붙이지 않음

🚨 선언과 분리하여, 최상단 또는 최하단에 export문 사용 가능

 

export default: '해당 모듈엔 개체가 하나만 있다’는 사실을 명확히 나타낼 수 있음

→ default를 붙여서 모듈을 내보내면 중괄호 {} 없이 모듈을 가져올 수 있음

    🚨 import 시, 객체의 이름을 export 대상의 이름과 무관하여 명명할 수 있음

 

 

import: 가져오기

🚨 가져오고 싶은 대상을 {...} 목록 안에 작성하면 한 줄에 작성할 수 있음

🚨 export 대상의 이름으로 import를 해야함(다르게 지정하고자 할 경우, as 사용)

 

+ as를 사용하여, 객체 행태로 import

 

 

 

참고 자료

 

모듈 내보내고 가져오기

 

ko.javascript.info