3-13.모듈(Module)
2023. 3. 30. 09:52ㆍJavascript/자바스크립트 제대로 배워볼래?
3-13.모듈(Module).html
<!DOCTYPE html>
<html>
<head>
<title>Document</title>
</head>
<body>
<!-- 방법 1. 3-13.module.js 파일에, 앞에 export 없을때 정상적으로 작동 -->
<!-- <script src="/script/3-13.module.js"></script>
<script>
log("log로 메시지 출력");
error("error로 메시지 출력");
</script> -->
<!-- 방법 2. export 추가 후 import 사용 -->
<!-- js 파일에서 모두 들고오기보다, 원하는것만 import해서 쓰면 훨씬 덜 무겁고 좋다, 에러도 덜함 -->
<script type="module">
import {log, error, PI} from "/script/3-13.module.js";
log(PI);
log("log로 메시지 출력");
error("error로 메시지 출력");
</script>
<script src="script/3-13.ref.js" type="module "></script>
</body>
</html>
/script/3-13.module.js
export function log(message) {
console.log(message);
}
export function error(message){
console.error(message);
}
export const PI = 3.14;
/script/3-13.ref.js
import {log} from "/script/3-13.module.js";
log("REF에서 출력하는 메세지");
'Javascript > 자바스크립트 제대로 배워볼래?' 카테고리의 다른 글
3-15.Error - try_catch_finally (0) | 2023.03.30 |
---|---|
3-14.클래스(Class) (0) | 2023.03.30 |
3-12.Async_Await (0) | 2023.03.30 |
3-11.Promise (0) | 2023.03.30 |
3-10.Array Destructuring (0) | 2023.03.30 |