[JS] 모듈

2022. 6. 17. 15:35·Stack/JavaScript

분리된 파일

 

export 지시자

외부모듈에서 해당 변수나 함수에 접근할 수 있도록 함(모듈 내보내기)

 

import 지시자

외부모듈의 기능을 가져와서 사용할 수 있음(모듈 가져오기)

 


 

index.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script type="module">
        // import { sayHi, sayHi2 } from './sayHi.js';
        // * as <obj> -> 객체 형태로 원하는 것들은 불러옴
        import * as say from './sayHi.js';

        console.log(say);
        console.log(say.sayHi('green'));
        console.log(say.sayHi2('blue'));
    </script>
</head>
<body>

</body>
</html>

 

sayHi.js

export function sayHi(user) {
    return `안녕! ${user}`;
}
export function sayHi2(user) {
    return `랄랄라! ${user}`;
}
// export { sayHi, sayHi2 }; // 두함수를 내보냄

'Stack > JavaScript' 카테고리의 다른 글

[JS] JumpGame  (0) 2022.06.17
[JS] Network  (0) 2022.06.17
[JS] canvas  (0) 2022.06.16
[JS/JSON] ShoppingList  (0) 2022.06.15
[JS] 동기 / 비동기 / 프로미스  (0) 2022.06.15
'Stack/JavaScript' 카테고리의 다른 글
  • [JS] JumpGame
  • [JS] Network
  • [JS] canvas
  • [JS/JSON] ShoppingList
7ingout
7ingout
  • 7ingout
    Hello, 7ingout world!
    7ingout
  • 전체
    오늘
    어제
    • 분류 전체보기 (205)
      • Project (5)
      • Stack (173)
        • React (40)
        • JavaScript (50)
        • TypeScript (14)
        • HTML (11)
        • CSS (31)
        • Spring (9)
        • PHP (15)
        • SQL (3)
        • Python (0)
      • ETC (9)
      • Design (13)
        • Illustrator (6)
        • Photoshop (7)
      • Articloid (4)
        • 7ingout (4)
  • 공지사항

    • ☻
  • 인기 글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.0
7ingout
[JS] 모듈
상단으로

티스토리툴바