javascript - JSDoc overbelastet funksjon fungerer ikke med TypeScript


Jeg bruker JSDoc-overload-syntaksen som foreslått i andre spørsmål og på nettet, ikke sikker på om jeg har det riktig, men her er det:

/**
 * @param {string} param
 * @returns {'string result'}
 *//**
* @param {number} param
* @returns {'number result'}
*/
function overloaded(param) {
  switch (typeof param) {
    case 'string': return 'string result';
    case 'number': return 'number result';
  }

  throw new Error(`Invalid type: ${typeof param}`);
}

overloaded('seven');
overloaded(7);

Denne funksjonen skal returnere string result nøyaktig hvis typen til inputparameteren er string og den skal returnere number result nøyaktig hvis typen til inputparameteren er number. I vanlig TypeScript ville dette være:

function overloaded2(param: string): 'string result';
function overloaded2(param: number): 'number result';
function overloaded2(param: string | number): 'string result' | 'number result' {
switch (typeof param) {
    case 'string': return 'string result';
    case 'number': return 'number result';
}

throw new Error(`Invalid type: ${typeof param}`);
}

overloaded2('seven');
overloaded2(7);

Problemet er at JSDoc som jeg har den sannsynligvis er feil fordi TypeScript-inferens som leveres av VS Code-språkservicen ikke klarer å plukke opp overbelastningen:

I utgangspunktet ser den bare den første overbelastningen. Er JSDoc-støtten i TypeScript avansert nok til at jeg kan type JavaScript-koden i samme grad som TypeScript-motstykket? Hvordan ville det se ut?

Svar #1

TypeScript 5 vil ha en ny @overload-tagg som vil la deg gjøre dette:

/**
 * @overload
 * @param {string} param
 * @returns {'string result'}
 *
 * @overload
 * @param {number} param
 * @returns {'number result'}
 *
 * @param {string | number}
 */
function overloaded(param) {
  // ...
}

Sjekk ut dette blogginnlegget for mer informasjon:

https://devblogs.microsoft.com/typescript/announcing-typescript-5-0-beta/#overload-support-in-jsdoc

Svar #2

OPPDATERING: Inkluderte min foretrukne metode

/**
 * @callback ConvertNumberToArray
 * @param {number} input
 * @return {number[]}
 *
 * @callback keepStrings
 * @param {string} input
 * @return {string}
 */

/**
 * @type {ConvertNumberToArray & keepStrings}
 */
const parse = input => {
  if (typeof input === 'number') return [input]
  else return input
}

Hvordan det ser ut i VSCode


ORIGINAL POST: Ta en titt her https://austingil.com/typescript-function-overloads-with-jsdoc/

Eksempel

/**
 * @type {{
 * (input: number) => number;
 * (input: string) => string;
 * }}
 */
const double = (input) => {
  if (typeof input === 'number') {
    return input * 2
  }
  return input + input
}

Relaterte artikler