[JavaScript] module & try..catch

module

---

웹 애플리케이션의 크기가 점점 커지면 관리하기가 힘듭니다. 자바스크립트로 구현하는 함수를 기능별로 분리하고, 그 기능별로 별도의 자바스크립트 파일로 만들어서 관리가 필요한 곳에서는 필요한 함수만 삽입해서 사용할 수 있는 기능입니다. export 지시자, import 지시자 가 있습니다.

• export 지시자를 변수나 함수 앞에 붙이면 외부 모듈에서 해당 변수나 함수에 접근할 수 있습니다(모듈 내보내기).
• import 지시자를 사용하면 외부 모듈의 기능을 가져올 수 있습니다(모듈 가져오기).

 

log.js 위치

 

HTML

<script type="module">
  import { log } from "./js/log.js";
  log("모듈에 작성된 함수를 이용해서 콘솔에 출력합니다.");
</script>

 

error handling

---

let n 이 string이어야 substring()을 쓸수 있어서 type error

)가 없어서 문법에러 syntax error

num 이 가져올 값이 없어서 reference error

let n = 3;
n.substring(0, 3); // type error

console.log(""; // syntax error

num; // reference error

 

 

try...catch

---

에러가 났을 때 프로그램 전체가 중단이 되는 것을 막고 프로그램적으로 관리하기 위해서 사용합니다.

try…catch’ 문법은 'try’와 'catch’라는 두 개의 주요 블록으로 구성됩니다.

 

try…catch 동작 알고리즘은 다음과 같습니다.

• 먼저, try {...} 안의 코드가 실행됩니다.
• 에러가 없다면, try 안의 마지막 줄까지 실행되고, catch 블록은 건너뜁니다.
• 에러가 있다면, try 안 코드의 실행이 중단되고, catch(err) 블록으로 제어 흐름이 넘어갑니다. 변수 err(아무 이름이나 사용 가능)는 무슨 일이 일어났는지에 대한 설명이 담긴 에러 객체를 포함합니다.

let x = "";
try {
  // try문 안에 있는 코드를 실행
  if (x === "") {
    throw "x is empty";
  }
} catch (error) {
  // try문에 있는 코드가 에러가 났을 때 에러 로그 기록
  console.log(error);
  writeLog(error);
}

function writeLog(message) {
  // 로그파일 혹은 데이터베이스에 저장
}

 

참고자료

https://ko.javascript.info/modules-intro

https://ko.javascript.info/try-catch