import, export (Module 모듈)
developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/import
developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/export
import
는 다른파일에서 내보낸 함수 객체 등을 가져올때
export
는 다른파일로 함수 객체 등을 내보낼때 사용한다.
module3.js
// 내보낼 class에 export를 붙여준다.
export class Person {
constructor(name) {
this.name = name;
}
walk() {
console.log("walk");
}
}
module2.js
// 가져올 클래스명을 {}객체형태로 불러온다
// module2.js는 같이 폴더내에 위치함
import { Person } from './module2';
// 마찬가지로 내보낼 class에는 export
// Teacher class는 Person class를 상속받는다.
export class Teacher extends Person {
constructor(name, degree) {
super(name);
this.degree = degree;
}
teach() {
console.log("teach");
}
}
module.js
// 마지막으로 Teacher class를 import한다.
import { Teacher } from './module3';
// 정상적으로 Teacher class와 Person class의 값을 사용 할 수 있다.
const teacher = new Teacher('Sample', 'MSc');
teacher.teach();
관련되서는 추가적인 내용이 존재하며, react나 기타 최신 js에서 많이 사용된다.
'JavaScript > Vanilla JS' 카테고리의 다른 글
export default (기본값) (0) | 2021.05.03 |
---|---|
IIFE (즉시 실행 함수) (0) | 2021.04.24 |
Destructuring (구조 분해 할당) (0) | 2021.04.23 |
eval (문자로 표현된 코드 실행) (0) | 2021.04.22 |
Promise (프로미스) 1 (0) | 2021.04.20 |
댓글
이 글 공유하기
다른 글
-
export default (기본값)
export default (기본값)
2021.05.03 -
IIFE (즉시 실행 함수)
IIFE (즉시 실행 함수)
2021.04.24 -
Destructuring (구조 분해 할당)
Destructuring (구조 분해 할당)
2021.04.23 -
eval (문자로 표현된 코드 실행)
eval (문자로 표현된 코드 실행)
2021.04.22