모듈 시스템 이란 ?
'코드' 를 '여러 파일로 분할' 한다.
그래서, 필요할 때, 해당 파일을 로드 한다.
이렇게, 쪼개진 파일을 어떻게 '내보내고', '가져올 수 있는가!'' 에 대한 방식을 제공하는 것이 모듈 시스템
모듈 시스템의 핵심은 '가져오기' 와 '내보내기' 임.
ES5 모듈 시스템 방식
1. 기본 문법
1.1 내보낼 때
module.exports
1.2 가져올 때
require
2. 예시
[testA.js 에서 내보내는 경우]
const text = "하이하이";
module.exports = text;
[testB.js 에서 가져오는 경우]
const {text} = require ("a.js")
console.log(text);
ES6 모듈시스템 방식
1. 내보내기
1.1 내보내는게 여러개 일 때
export {text}
1.2 내보내는게 한 개 일 때 | '단일' 로 내보낼 때
export default text
2. 예시
[testA.js 에서 내보내는 경우]
const text = "하이하이";
export {text}; // '여러개' 내보내는 경우
export default text; // '단일' 로 내보내는 경우
[testB.js 에서 받는, 가져오는 경우]
import {text} from "a.js"
// export {text} 로 내보내는 경우
// ⭐이름은 내보낼 때의 이름과 일치 해야 함⭐
import test2 from "a.js"
// export default 로 내보내는 경우
// ⭐test2 대신 다른 이름으로 변경해서 사용해도 됨