JSDoc

오늘 오후에 점핏에서 진행하는 '프론트엔드 개발 이야기'에서 강연한 내용 중에 타입스크립트에 대해 강연한 내용이 인상적이었다. 그 중 JavaScript에서 타입스크립트처럼 사용할 수 있는 방법을 배운 부분이 가장 인상적이었다. 그게 바로 JSDoc이다. 강사님께서는 타입스크립트가 아직 익숙하지 않는다면 JSDoc을 먼저 JS문서에 사용해보며 타입에 대해 익숙해진다음 타입스크립트를 사용해보는 것도 좋은 방법이라고 하셨다.

---

@ts-check

js 확장자를 가진 문서에 JSDoc을 통해 타입 힌트를 제공하려면 js 확장자를 가진 문서의 첫 줄에 주석으로 // @ts-check을 사용해야 한다. 

 

@type

js 확장자를 가진 문서에서는 타입들을 유추해야 하지만 JSDoc의 구문을 사용하면 타입을 명시할 수 있을 뿐만 아니라 명시한 타입이 아닐 경우 오류를 발생시킨다.

// @ts-check
// @errors: 2322
/** @type {number} */
var x;

x = 0; // 성공
x = false; // 성공 아님

 

@param, @return

@param은 @type과 동일하게 사용하지만 매개변수의 이름을 추가할 수 있다.

//ts-check
/**
 * @param {string}  p1 - string 매개변수.
 * @param {string=} p2 - 선택적 매개변수 (클로저 구문)
 * @param {string} [p3] - 또다른 선택적 매개변수 (JSDoc 구문).
 * @param {string} [p4="test"] - 기본값과 선택적 매개변수
 * @return {string} 이것은 결과 값입니다
 */
function stringsStringStrings(p1, p2, p3, p4) {
  // TODO
}

 

더 여러가지의 JSDoc구문의 자세한 내용은 다음 홈페이지를 참고하면 된다.

https://typescript-kr.github.io/pages/jsdoc-reference.html

 

---

출처

- https://typescript-kr.github.io/pages/intro-to-js-with-ts.html

- https://typescript-kr.github.io/pages/jsdoc-reference.html