1. html 파일과 js 파일 분리하기
<!-- index.html -->
<head>
<!-- defer: 자바스크립트 코드를 지연 실행시킨다. -->
<!-- module: 독립적인 스콥을 생성한다. -->
<!-- 항상 엄격 모드 (use strict)로 실행된다. -->
<!-- type="module": 자동으로 지연시켜주기 때문에 defer 쓰지 않아도 된다. -->
<script src="./src/main.js" type="module"></script>
</head>
// src/main.js 파일
// Application의 전체 로직을 확인할 수 있는 파일
import { movieData } from "./movie.js";
import { movieTitle } from "./search.js";
let movies = movieData();
console.log(movies) // [1, 2, 3]
let search = movieTitle();
console.log(movies) // [4, 5, 6]
// src/movie.js 파일
// 영화 정보를 가져와서 UI에 리스팅하는 기능을 담당
export let movieData = () => [1, 2, 3];
// src/search.js 파일
// 원하는 제목의 영화만 검색(필터링)하는 기능을 담당
export let movieTitle = () => [4, 5, 6]
참고 레퍼런스) 내배캠 학습자료
'JavaScript' 카테고리의 다른 글
| JS) 화살표 함수, DOM 제어하기 (0) | 2023.06.02 |
|---|---|
| JS) Web speech API로 음성 구현해보기 (0) | 2023.05.17 |