프론트 엔드 개발자가 되기위한 여정 -첫번째 주말편

이정우·2022년 9월 4일
0

frontend-bootcamp

목록 보기
6/60

안녕하세요 오늘은 주말에 따로 공부한 내용들에 대해서 작성해보려고 합니다!
바로!

import와 export

입니다!

먼저
본설명에 들어가기에 앞서 모듈이라는 것에 대해서 이야기를 드리겠습니다

모듈이란 무엇일까요???

모듈이란?

각각의 기능을 가진것이 모듈이라고 합니다!

예를들어
계산기를 가정했을때
더하기,빼기, 곱하기, 나누기등 여러가지 기능을 합니다
이것을 파일 여러개로 분해하여
한개의 파일에는 더하기의 기능을 구현하는 함수를 담아두고
다른 부분에는 빼기 기능을,
다른 파일들에는 곱하기와 나누기등을 분해하여 넣어두면
나중에 이것들의 기능이 있는 파일을 불러와서 사용만 하기만 하면 될 것입니다.

이것이 바로 모듈의 개념입니다

여기서 궁금하실수도 있겠는데요!

아니! import와 export를 설명한다고 하는데 왜 갑자기 모듈을 설명하냐!

라는 생각을 하실수도있습니다
이 이야기를 드린이유는
먼저는 이 개념을 저희가 살짝쿵 적립하고 간다면 이후의 내용을 조금 더 쉽게 다룰수 있기 때문입니다!

먼저 본 주제는 이 모듈들을 호출할때 사용하는 특수한 지시자 이기 때문입니다!!

1.export

말 그대로
파일또는 모듈(파일)안의 함수나 객체를 내보내는데 사용이됩니다!

그렇기에 이 export를 사용하여 모듈을 내보내게 되고 이를 통해 다른 파일에 함수를 넣을 수있게 되는거죠

마치 위의 예시와 같이
계산기 파일을 만들기 위해서 빈파일을 만든 이후에 export한 모듈들을 넣어주기만 하면 힘들게 새롭게 코딩 하지 않아도 쉽게쉽게 구현할 수 있게 되겠습니다

자 이렇게 ! export를 했다면 반대로 파일안에 넣을수 있는 어떠한 명령어가 필요하겠죠!

그게 바로!!

2.import

입니다!!

앞서 export에서 내보내준 데이터들이 있었죠!!
이 데이터들을 어떻게 가져올까요??

!! 맞습니다! 바로 import 를 통해서 할수 있는데요 !

이 import는 외부 모듈의 export된 함수,객체를 가져오는데 사용이 됩니다!

import 를 사용해서 모듈(파일) 전체를 가져올수도 있구요!
아니면 원하는 하나의 함수만을 가져올수도있고
여러개의 함수도 가져올수 있습니다!!

이렇게 된다면 모듈(파일)안의 필요한 부분들만 가져와서 사용할수도 있고 작업 효율도 빨라져서 훨씬 좋아지겠죠?!

오늘은 이렇게 간단히 export와 import에 대해서 알아 보았는 데요!
내일은 또 새로운 것을 함께 알아보겠습니다!!
내일 다시봐요~~~

profile
주니어 프론트엔드 개발자

0개의 댓글