<div id="readability-page-1" class="page"><div>JSDoc의 목적은 JavaScript 애플리케이션 또는 라이브러리의 API를 문서화하는 것이다. 모듈, 네임스페이스, 클래스, 메서드, 메서드 매개변수 등과 같은 것을 문서화하려고 한다.
JSDoc 주석은 일반적으로 문서화되는 코드 직전에 위치해야 하며 <code>/**</code>로 시작해야 한다.
WebStorm에서 <code>/**</code> + <code>Enter</code> 를 사용하면 아래와 같이 JSDoc이 자동으로 작성된다.

 <a href="/static/790bc2eb440988bf735bcf16f042e80c/dd507/jsdoc-skeleton.png" target="_blank" rel="noopener">
 
 <img alt="jsdoc-skeleton" title="jsdoc-skeleton" src="https://jhyeok.com/static/790bc2eb440988bf735bcf16f042e80c/fcda8/jsdoc-skeleton.png" sizes="(max-width: 590px) 100vw, 590px" loading="lazy" decoding="async">
 </a>
 
하지만 작성된 JSDoc의 정보에는 타입이 포함되어 있지 않고 반환 값도 명시되어 있지 않은 빈약한 정보이다. WebStorm에서 위의 사진처럼 JSDoc이 작성이 된다면 아래 옵션을 설정해서 타입과 <code>@returns</code>태그를 추가할 수 있다.
<ul>
<li><code>Preferences</code> -&gt; <code>Editor</code> -&gt; <code>Code Style</code> -&gt; <code>TypeScript</code> -&gt; <code>Code Generation</code> -&gt; <code>Comments</code> -&gt; <code>Include types in JSDoc</code></li>
</ul>

 <a href="/static/3859b0c17d3338693ecb152a7f40433b/31d79/jsdoc-types-setting.png" target="_blank" rel="noopener">
 
 <img alt="jsdoc-types-setting" title="jsdoc-types-setting" src="https://jhyeok.com/static/3859b0c17d3338693ecb152a7f40433b/fcda8/jsdoc-types-setting.png" sizes="(max-width: 590px) 100vw, 590px" loading="lazy" decoding="async">
 </a>
 
<code>Include types in JSDoc</code>을 체크한 상태와 체크하지 않은 상태의 템플릿을 사용해서 만들어진 JSDoc을 비교해보도록 한다.
<ul>
<li><code>Include types in JSDoc</code> - OFF</li>
</ul>

 <a href="/static/7b10d4410a6a34704a8ecf46027545c7/71c1d/jsdoc-example.png" target="_blank" rel="noopener">
 
 <img alt="jsdoc-example" title="jsdoc-example" src="https://jhyeok.com/static/7b10d4410a6a34704a8ecf46027545c7/fcda8/jsdoc-example.png" sizes="(max-width: 590px) 100vw, 590px" loading="lazy" decoding="async">
 </a>
 
<ul>
<li><code>Include types in JSDoc</code> - ON</li>
</ul>

 <a href="/static/8687f743ca714e1d675b2855f1b25197/71c1d/jsdoc-types-example.png" target="_blank" rel="noopener">
 
 <img alt="jsdoc-types-example" title="jsdoc-types-example" src="https://jhyeok.com/static/8687f743ca714e1d675b2855f1b25197/fcda8/jsdoc-types-example.png" sizes="(max-width: 590px) 100vw, 590px" loading="lazy" decoding="async">
 </a>
 
<h3>Reference</h3>
<a href="https://jsdoc.app/about-getting-started.html" target="_blank" rel="nofollow noopener noreferrer">https://jsdoc.app/about-getting-started.html</a></div></div>

JHyeok

JSDoc의 목적은 JavaScript 애플리케이션 또는 라이브러리의 API를 문서화하는 것이다. 모듈, 네임스페이스, 클래스, 메서드, 메서드 매개변수 등과 같은 것을 문서화하려고 한다.
JSDoc 주석은 일반적으로 문서화되는 코드 직전에 위치해야 하며 /**로 시작해야 한다.
WebStorm에서 /** + Enter 를 사용하면 아래와 같이 JSDoc이 자동으로 작성된다.
      
    
  
  
    
하지만 작성된 JSDoc의 정보에는 타입이 포함되어 있지 않고 반환 값도 명시되어 있지 않은 빈약한 정보이다. WebStorm에서 위의 사진처럼 JSDoc이 작성이 된다면 아래 옵션을 설정해서 타입과 @returns태그를 추가할 수 있다.
Preferences -> Editor -> Code Style -> TypeScript -> Code Generation -> Comments -> Include types in JSDoc
      
    
  
  
    
Include types in JSDoc을 체크한 상태와 체크하지 않은 상태의 템플릿을 사용해서 만들어진 JSDoc을 비교해보도록 한다.
Include types in JSDoc - OFF
      
    
  
  
    
Include types in JSDoc - ON
      
    
  
  
    
Reference
https://jsdoc.app/about-getting-started.html

WebStorm에서 JSDoc을 사용할 때 type, returns 태그를 자동으로 추가하기

댓글