So generieren Sie JSDoc für die Funktion `pipe`d ES6

10

Ich habe eine ES6-ähnliche Funktion, die mithilfe der Funktionskomposition mit definiert wird asyncPipe.

import { getItemAsync } from 'expo-secure-store';

const asyncPipe = (...fns) => x => fns.reduce(async (y, f) => f(await y), x);

const getToken = () => getItemAsync('token');

const liftedGetToken = async ({ ...rest }) => ({
  token: await getToken(),
  ...rest,
});

const liftedFetch = ({ body, route, token, method = 'GET' } = {}) =>
  fetch(route, {
    ...(body && { body: JSON.stringify(body) }),
    headers: {
      'Content-Type': 'application/json',
      ...(token && { Authorization: `Bearer ${token}` }),
    },
    method,
  });

const json = res => res.json();

/**
 * @method
 * @param {Object} fetchSettings the settings for the fetch request
 * @param {Object} fetchSettings.body the body of the request
 * @param {string} fetchSettings.route the URL of the request
 * @param {string} fetchSettings.method the method of the request
 * @param {string} fetchSettings.token should only be used for testing and unauthenticated requests
 */
const request = asyncPipe(liftedGetToken, liftedFetch, json);

Wie Sie sehen, habe ich versucht, eine JSDoc-Beschreibung hinzuzufügen. Aber wenn ich es irgendwo benutze, schlägt mein Editor, VSCode, seine Parameter nicht vor. Wie deklarieren Sie diese Art von Funktionen mit JSDoc? Und wie bekomme ich Parameter für diese Funktion, um mit Intellisense zu arbeiten?

J. Hesters
quelle

Antworten:

1

VSCode verwendet die TypeScript-Engine unter der Haube, die nicht gut darin ist, Typen aus Funktionskompositionen abzuleiten, und erkennt, wie Sie gesehen haben, eine punktfreie Komposition nicht als Funktionsdeklaration.

Wenn Sie Typhinweise wünschen, können Sie die Argumente für die zusammengesetzte Funktion angeben, indem Sie eine spitze Funktion darum wickeln.

Ich würde es ungefähr so ​​schreiben - Hinweis: Standardwerte machen das JSDoc für Typhinweise unnötig, aber Sie können das JSDoc trotzdem für die Beschreibungen behalten. Stellen Sie außerdem sicher, dass Fehler, die durch Standardwert-Fallbacks verursacht werden, zu einer angemessenen Fehlermeldung führen.

/**
  * http request with JSON parsing and token management.
  * @param {Object} fetchSettings the settings for the fetch request
  * @param {Object} fetchSettings.body the body of the request
  * @param {string} fetchSettings.route the URL of the request
  * @param {string} fetchSettings.method the method of the request
  * @param {string} fetchSettings.token should only be used for testing and unauthenticated requests
  */
const request = ({
  body = {},
  route = '',
  method = 'GET',
  token = ''
}) => asyncPipe(liftedGetToken, liftedFetch, json)({
  body, route, method, token
});
Eric Elliott
quelle
6

VSCode versucht, den Kommentar der anonymen Funktion darin anzuzeigen asyncPipe. Wenn Sie einen JSDoc-Kommentar hinzufügen, sehen Sie das Verhalten:

const asyncPipe = (...fns) =>
  /**
   * My asyncPipe description
   * @param {Object} x Any object
   */
  x => fns.reduce(async (y, f) => f(await y), x);

const request = asyncPipe(liftedGetToken, liftedFetch, json);

Beispiel

Leider gibt es in JSDoc keine Möglichkeit, die Dokumentation der anonymen Funktion zu überschreiben, wie Sie es versucht haben. Sie können Ihre Absicht jedoch wie folgt auf VSCode erzwingen. Beachten Sie jedoch, dass dies einen zusätzlichen Funktionsaufruf einführt:

const doRequest = asyncPipe(liftedGetToken, liftedFetch, json);

/**
 * @method
 * @param {Object} fetchSettings the settings for the fetch request
 * @param {Object} fetchSettings.body the body of the request
 * @param {string} fetchSettings.route the URL of the request
 * @param {string} fetchSettings.method the method of the request
 * @param {string} fetchSettings.token should only be used for testing and unauthenticated requests
 */
const request = fetchSettings => doRequest(fetchSettings);

Lösungsbeispiel

A1rPun
quelle