Cách tạo JSDoc cho hàm `pipe`d ES6


10

Tôi có một hàm kiểu ES6 được xác định bằng cách sử dụng thành phần hàm với 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);

Như bạn thấy tôi đã thử thêm một mô tả JSDoc vào nó. Nhưng khi tôi sử dụng nó ở bất cứ đâu, trình soạn thảo của tôi, VSCode, không đề xuất các tham số của nó. Làm thế nào để bạn khai báo các loại chức năng này với JSDoc? Và làm cách nào để có được thông số cho chức năng này hoạt động với Intellisense?


Câu trả lời:


1

VSCode sử dụng công cụ TypeScript dưới mui xe, không tốt trong việc suy ra các loại từ các thành phần chức năng và như bạn đã thấy, không nhận ra một thành phần không có điểm như là một khai báo hàm.

Nếu bạn muốn gợi ý kiểu, bạn có thể chỉ định các đối số cho hàm tổng hợp bằng cách gói một hàm nhọn xung quanh nó.

Tôi sẽ viết một cái gì đó như thế này - lưu ý: các giá trị mặc định làm cho JSDoc không cần thiết cho các gợi ý loại, nhưng dù sao bạn cũng có thể muốn giữ JSDoc cho các mô tả. Cũng đảm bảo rằng các lỗi gây ra bởi dự phòng giá trị mặc định tạo ra thông báo lỗi đầy đủ.

/**
  * 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
});

6

VSCode sẽ cố gắng hiển thị bình luận của chức năng ẩn danh bên trong asyncPipe. Nếu bạn thêm một bình luận JSDoc bên trong nó, bạn có thể thấy hành vi:

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);

thí dụ

Thật không may, không có cách nào trong JSDoc ghi đè lên tài liệu của hàm ẩn danh như bạn đang cố gắng thực hiện. Tuy nhiên, bạn có thể buộc ý định của mình vào VSCode như thế này, xin lưu ý rằng điều này giới thiệu một lệnh gọi hàm bổ sung:

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);

ví dụ giải pháp

Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookieChính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.