본문 바로가기

study/JavaScript

Js - JSDoc

진행하던 프로젝트를 어느정도 마무리 지어 놓고나니 주석이 부족함을 느끼게 되었다.

효율적인 주석을 달기위해 구글링 결과 JSDoc에 대하여 알게 되었고 현재 프로젝트는 vue.js로 구현되어 있으며, Type Script를 사용하지 않아 타입 추론에 불편함이 존재하였다.

JSDoc은 VsCode와 같은 에디터에서도 기능을 지원해준다고 하며 JSDoc을 이용하면 타입 추론도 가능해서 프로젝트에 반영 중 너무 편리한 기능인것 같아 기록하려 한다.

 

JSDoc이란 JavaScript 소스 코드에 대한 설명을 하기 위해 사용하는 마크업 언어라고 한다. JSDoc의 주목적은 JavaScript 앱 또는 라이브러리 API를 문서화하는 것이며 모듈, 네임스페이스, 클래스, 메서드, 파라미터 등과 같은 항목을 문서화할때 사용한다고 한다.

 

간단한 예시 1.

/**
* 두 숫자를 더하는 함수
* @param {number} a 첫번째 숫자
* @param {number} b 두번째 숫자
* @returns a + b 의 결과를 반환
*/
addNum(a, b) {
  return a + b
},

위와 같이 주석을 작성한 후 해당 함수에 마우스를 올려보면 아래 사진과 같이 해당 함수에 대한 설명(파라미터 타입은 무었인지, 어떤 파라미터를 줘야하는지, 어떤 기능을 하는 함수인지, 리턴값은 무었인지 등)을 볼 수 있어 참 편리하다!! 디버깅 할때에도 정말 좋다.

결과1

간단한 예시 2.

변수에도 어떤 타입을 줘야하는지 확인할 수 있어 편리하다.

/** @type {string}*/
title: "",

결과2

 

JSDoc에는 더 많은 기능이 있으니 더 궁금할 경우 아래 링크를 참고하면 된다.

https://jsdoc.app/