[23.10.24] 오늘의 TIL

오늘부터 새로운 프로젝트를 하게되는데
이전에 했던 개인프로젝트를 토대로 팀 내에서 투표로 뽑힌 코드를 디벨롭하는 프로젝트다

이번에 내가 뽑히게 되어서 머쓱 했지만
다른분들의 코드를 조금씩 봤더니
같은 내용을 담고있더라도 다른 코드를 작성하신걸 보고
내가 조금 더 디벨롭 할수있는 부분은 최대한 캐치하고
다른 분들께는 최대한 내가 작성한 코드를 쉽게 이해시켜드리고 싶었으나
말로 코드를 한줄 한줄 설명하다보니까 뭔가 중구난방으로 설명하게 되는걸 보고
조금 더 효율적으로 설명해드릴수있는 방법이 없을까 하고 검색을 하다가

---

JSDOC

JSDOC 을 알게되었다!
JSDOC 은 Javadoc과 유사한 JavaScript용 API 문서 생성기이다!
문서 주석을 코드와 함께 소스코드에 직접 추가가 가능하다!
처음에는 그냥 주석 쓰면 되는거 아닌가? 했는데
함수정보, 타입 힌트 등을 제공할 수 있어서 유용하다고 한다!

JSDOC 사용 방법

/** 
...
*/

⁉️ 꼭 위와같은 형태로 사용해야하며 /*, /*** 이러한 형태로 시작하게되면 무시하게 됩니다!

@type

/** @type {(String|Array.)} */
let foo;
/** @type {number} */
let bar = 1;

이처럼 string, Array, number 을 통해서 해당 변수가 어떤 타입의 변수인지를 알 수 있으며

/** 
* @type {number[]} 
*/
let ns;

/** 
* @type {Array.<number>} 
*/
let nds;

/**
* @type {Array<number>} 
*/
let nas;

이외에도 배열타입도 지정이 가능하다!

@param, @returns

/**
 * 두 수의 차를 구한다.
 * @param {number} a - the first thing
 * @param {number} b - the second thing
 * @returns {number}
 */
 const subtract = (a, b) => a - b;

이렇게 함수의 파라미터값과 리턴값도 정의가 가능합니다!

@typedef

/**
 * 할일
 * @typedef {Object} Todo
 * @property {number} id - 할일 id
 * @property {string} content - 할일 내용
 * @property {boolean} completed - 할일 완료 여부
 */

/**
 * 할일 목록
 * @type {Todo[]}
 */
const todos = [
  { id: 1, content: 'HTML', completed: false },
  { id: 2, content: 'CSS', completed: true },
  { id: 3, content: 'Javascript', completed: false },
];

이렇게 커스텀을 통해 태그 타입지정도 가능합니다!

오늘 하루 공부한 내용으로 적기엔 내용이 너무 많은거같아서
추후에 더 알아보고 정리한걸 다시 적어놓겠습니다!