자바스크립트

가져오기,내보내기

웅-이 2022. 8. 27. 18:00

그림과 같이 보면 module.js 라는 하나의 파일이 존재하고 확장자가 js인 자바스크립트 파일이다.

자바스크립트 파일은 기본적으로 외부에 있는 다른 자바스크립트 파일을 가지고 올수 있는 하나의 통로를 가지고있다.

대표적으로 Import라는 키워드를 통해서 외부에 있는 다른 자바스크립트 파일을 가지고 오는 문법을 작성을 한다.

 

그리고 자바스크립트 파일은 안에있는 특정 내용을 밖으로 내보낼 수 있는 두개의 통로를 가지고있다. 

하나는 Default export 라고해서 이름을 따로 지정하지 않아도되는 기본통로가 있고

 

두번째 는 Named export 라고해서 이름을 꼭 지정해줘야하는 통로가 존재한다.

 

따로 이름을 지정할 필요가없는 통로를 사용할때는 export 키워드와 함께 Default 라는 키워드를 사용해줄 수 가 있다.

 

아래의 그림과 같이

 

예를 들어서 main.js 같은 경우에는 나가는 통로는 따로 활용하지 않고 가지고오는 통로만 활용해서 파일의 구성을 작성할성할 수 가 있다. 어떤 특정 파일은 가지고오는 코드는 없는데 내보내는 코드만 존재해서 결국에는 어디선가 쓸수있는 구조로 파일을 만들어줄수가 있겠고 이러한 구조로 만드는것을 module 이라고 뜻한다.

 

이러한 기본적인 자바스크립트 파일은 언제든지 module 될 준비가 되어있고 module 이라는것이 꼭 export라는 통로로 꼭 내보내져야지만 module 이되는것은 아니고 이러한 통로가 다 막혀있다 하더라도 충분히 module 이 될수가 있고

충분히 불러 올수가 있다. 

import 했을시 사용자 가 지정한 이름으로 사용가능!

이름을 지정해주는 통로일경우!

random 이라고 지정해주는 경우 에러가 출력 

이름이 지정된 데이터통로 나올경우에는 그 데이터를 {} 한번지정해줘야 사용이 가능하다! 

이름을 지정해야하는 통로로 내보내는 데이터는 이름만 지정되 있으면 몇개를 내보내 든지 전혀 상관이없다.

반대로 이름을 지정하지 않는 기본통로는 하나의 파일에서 하나의 내보내기만 가능하다!

이것을 통해서 main.js 파일 에서 import 키워드를 통해서 { } 를 사용하지않는 이름으로 가지고 올때는 

기본통로를 통해서 가져온 데이터이고

{ } 를 사용해서 작성하는 이름같은경우에는 이름을 지정해야하는 통로로 가지고온것이다.