06.export, import (내보내기, 가져오기)
Updated:
export, import
JS
에서는import
키워드로 가지고 올 수 있고,export
키워드로 외부로 빼낼 수 도 있습니다 - 하나하나를module
이라고 합니다.
1. default (export)
- 이름을 따로 지정하지 않아도
export
가 되는 방식입니다. - 만약,
import
할때, 따로 이름이 없기 때문에 변수를 따로 지정해도 작동에는 문제가 없습니다 - 주의!!
default
에서는 하나의 데이터(함수) 만 내보내지 못합니다.
export default function () {
return Math.floor(Math.random() * 10)
} // 함수에 이름이 없어도 export 가 됨
export default function (data) {
return Object.prototype.toString.call(data).slice(8, -1)
}
2. named (export)
- 반드시 이름이 있어야 하며, import 시, {} 를 사용하여 표시해주어여 함니다.
// export
export default function random() {
return Math.floor(Math.random() * 10);
}
// import
import { random } from "./getRandom";
- named 는 여러개의 데이터(함수)를 export, import 할 수 있습니다.
// export
export function random() {
return Math.floor(Math.random() * 10);
}
export const user = {
name: "Jacob",
age: 80,
};
// import
import { random, user } from "./getRandom";
console.log(random());
console.log(user);
- as 키워드를 사용하여 import 시 이름을 바꿔서 사용할 수 있습니다.
// import
import { random, user as jacob } from "./getRandom";
console.log(random());
console.log(jacob);
- named export 에서 한번에 전체 다 가지고 오려면 와일드 카드(Wildcard Character, *) 를 사용해서 가지고 올 수 있습니다.
import * as G from "./getRandom"; // G는 아무 이름 변수를 사용해도 상관 없음
console.log(R);
3. sum up
- Js에서 어떠한 특정한 내용을 딱 한번만 내보내기 할 경우는 되도록이면 export defalut 를 사용합니다.
- 내보내기가 많으면 named export 를 사용해서 작성해야 합니다.
Leave a comment