타입 힌팅 개요

GitLab 프론트엔드 코드베이스에서 JSDoc을 활용한 타입 힌팅 방법과 시스템 요구 사항을 설명합니다.

GitLab 프로젝트의 프론트엔드 코드베이스는 현재 타입을 요구하거나 강제하지 않습니다. 타입 어노테이션 추가는 선택 사항이며, JavaScript 코드베이스에서 타입 안전성을 강제하지도 않습니다. 다만 타입 어노테이션은 코드베이스를 명확하게 하는 데, 특히 공용 유틸리티 코드에서 큰 도움이 될 수 있습니다. 이 문서에서는 타입 힌팅이 현재 어떻게 동작하는지, 새 타입 어노테이션을 어떻게 추가하는지, GitLab 프로젝트에서 타입 힌팅을 어떻게 설정하는지 다룹니다. JSDoc # JSDoc 은 특별한 형식의 주석을 사용해 JavaScript 코드의 타입을 문서화하고 설명하는 도구입니다. JSDoc의 타입 어휘는 비교적 제한적이지만 여러 IDE 에서 폭넓게 지원됩니다. 예시 # 함수 설명 # 함수 타입을 설명할 때는 @param 과 @returns 를 사용합니다. /** * Adds two numbers * @param { number } a first number * @param { number } b second number * @returns { number } sum of two numbers */ function add ( a, b ) { return a + b; } 선택적 파라미터 # 파라미터 이름을 대괄호 [] 로 감싸면 선택적 파라미터로 표시됩니다. [name=value] 구문을 사용해 기본값을 지정할 수 있습니다. /** * Adds two numbers * @param { number } value * @param { number } [increment=1] optional param * @returns { number } sum of two numbers */ function increment ( a, b= 1 ) { return a + b; } 객체 파라미터 # 객체를 받는 함수는 @param 이름에 object.field 표기를 사용해 타입을 지정할 수 있습니다. /** * Adds two numbers * @param { object } config * @param { string } config.path path * @param { string } [config.anchor] anchor * @returns { string } */ function createUrl ( config ) { if (config. anchor ) { return path + '#' + anchor; } return path; } 즉시 값이 할당되지 않는 변수의 타입 어노테이션 # 도구와 IDE는 값이 즉시 할당되지 않는 변수의 타입을 추론하기 어렵습니다. 이런 변수에는 @type 표기를 사용해 타입을 지정할 수 있습니다. /** @type { number } */ let value; 구문에 대한 자세한 내용은 JSDoc 공식 웹사이트 를 참고합니다. JSDoc 사용 팁 # 기본 타입에는 소문자 이름 사용 # 대문자와 소문자 모두 허용되지만, 원시 타입이나 객체에는 대부분 소문자를 사용합니다. boolean , number , stri