import(가져오기), export(내보내기)

강다현·2022년 7월 20일
0

자바스크립트에서는 모듈 방식의 코드를 작성할 수 있는 기능이 있어서 여러 개의 파일로 코드를 분할할 수 있다. 그래서 코드를 여러 파일로 나누고 나눈 html 파일을 다른 파일에 적용시킬 수 있다. 문장을 import, export는 자바스크립트 파일 안에 있는 것으로 다른 파일에서 컨텐츠를 내보낼 수도 있으며 파일을 불러올 수 있다.

export는 default 키워드를 붙여서 person을 내보낼 수 있습니다. 그런 다음 다른 파일에 객체를 import 할 수 있는데, 여러 개를 export할 수도 있다. 세 번째 파일 app.js에서는 person.js와 utility.js 파일에서 코드를 적용시키기 위해 import를 사용하여 불러 올 수 있다.

App.js

Import person from ‘./person.js’

Import pro from ‘./person.js’

위 의 import는 person.js에서는 default 키워드를 사용하고 있는데, default는 파일에서 코드를 가져오면 항상 default export가 내보낸 것을 기본값으로 가져온다는 것을 의미한다. 그래서 person.js에서 person를 import하면 원하는 대로 객체의 이름을 정할 수 있다.

Import { baseData } from ‘./utility.js’

Import { clean } from ‘./utility.js’

위 의 import는 두 개의 다른 상수를 불러오는데 그 파일에서 특정한 코드를 정확하게 불러오기 위해 export 구문에서 중괄호를 사용한다. 이것을 named export라고 한다. 지정한 상수명으로 불러오기 때문이다. 여기서 각각의 상수명 clean과 baseData를 export default로 지정하지 않았기 때문에 원하는 코드 부분을 불러올 수 있다. 그래서 원하는 코드를 정확하게 자바스크립트에서 지정한 이름을 중괄호 사이에 입력해야 한다. 또한 import문에 콤마를 넣어서 { baseData, clean } 또는 { clean, baseData } 라고 한 문장으로 작성할 수도 있다.

profile
Hello🖐

0개의 댓글