//hello.js
function helloWorld(a){
return 'hello world'+a+'!'
}
// app.js
console.log(helloWorld('yoooonk')); // hello world yooooonk!
...
<body>
<script src="src/hello.js"></script>
<script src="src/app.js"></script>
</body>
모듈이 없던 때에는 하나의 html 파일에서 위의 방법으로 로딩을 해서 실행을 했다.
이렇게 하면 함수들이 전역 scope 에서 작동하게 된다.
함수 스코프를 만들어 사용.
var hello = hello||{};
(function(){
function helloWorld(a){
return 'hello world'+a+'!'
}
hello.helloWorld = helloWorld;
})
exports 키워드로 모듈을 만들고 require() 함수로 호출해서 사용할 수 있다. Nodejs에서 사용하는 방식
// hello.js
exports function helloWorld(a){return 'hello world'+a+'!' }
// app.js
const helloWorld = require('./hello.js');
helloWorld('yooooonk');
표준 모듈 시스템의 등장으로 바벨과 웹팩을 이용해 모듈 시스템을 사용하는 것이 일반적이다.
export 키워드로 모듈을 만들고, import 키워드로 가져와 사용한다.
//hello.js
export function helloWorld(a){return 'hello world'+a+'!' }
// app.js
import * as hello from './hello.js';
//import {helloWorld}
hello.helloWorld(a);
📑 reference