JavaScript

모듈

fromslow 2020. 7. 30. 21:43

모듈은 재사용 가능한 코드 단위이자 파일 간에 주고받을 수 있는 코드 단위를 말한다.

모듈은 함수, 클래스, 배열, 객체, 상수가 될 수 있다.

 

 

export

export는 모듈을 다른 파일로 내보낼 때 사용한다.

 

예를 들어, 아래와 같은 코드를 export 할 때에는

sayHello = (name) => console.log(`내 이름은 ${name}이야`);

 

아래와 같이 쓴다.

export sayHello;

 

또는 아래와 같이 함수를 정의할 때 명시해주어도 된다.

export sayHello = (name) => console.log(`내 이름은 ${name}이야`);

 

 

함수뿐만 아니라 상수, 배열, 클래스, 객체도 마찬가지다.

export const name = `김구름`;

export let oddNumbers = [1, 3, 5, 7, 9];

export class Student { constructor(name) { this.name = name; } }

 

export default : 모듈을 하나만 내보낼 때 쓰이며, 실제로 하나만 내보낸다면 쓰기를 권장한다.

export as : 내보낼 모듈의 이름을 내가 지정한 이름으로 바꾸어 내보내고 싶을 때 사용한다.

 

sayHello = (name) => console.log(`내 이름은 ${name}이야`);

export default sayHello as myName;

 

 

import

import는 내보낸 모듈을 다른 파일에서 가져올 때 사용한다.

 

형식은 아래와 같다.

 

import { sayHello } from './greetings.js'

 

즉, greetings.js 파일로부터 sayHello라는 모듈을 가져온다는 뜻이다.

 

./는 '현재 디렉토리에 있는'이라는 의미이다.

다른 디렉토리에 동일한 이름을 가진 파일이 있을수도 있으니 현재 디렉토리라고 명확히 표시하는 것이다.

 

아래와 같이 내가 지정한 이름으로도 가져올 수 있다.

import {sayHello as hihi, sayBye as goodbye};