> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Using JSDoc

## Article: Using JSDoc

## Article Link: https://dev.wix.com/docs/develop-websites/articles/workspace-tools/velo-workspace/code-editor-ide/using-jsdoc.md

## Article Content:

# About Type Checking and Autocomplete Using JSDoc Tags
[JSDoc](https://jsdoc.app/) is a popular markup language used to document JavaScript code, applying type checking and autocomplete as you write your code. 
You can use JSDoc in a Wix environment in the same way as you would in any JavaScript environment.
Adding JSDoc to your custom code allows you to benefit from [type checking and code autocomplete](#type-checking-and-autocomplete).

## Supported IDEs

You can add and benefit from JSDoc using:

+ The [editor](https://dev.wix.com/docs/develop-websites/articles/workspace-tools/velo-workspace/workspaces/wix-studio-working-with-the-code-panel.md) (Wix Studio and Wix Editor).
+ The [Wix IDE](https://dev.wix.com/docs/develop-websites/articles/workspace-tools/velo-workspace/wix-ide/wix-studio-about-the-wix-ide.md) (Wix Studio).
+ Your [local IDE](https://dev.wix.com/docs/develop-websites/articles/workspace-tools/developer-tools/git-integration-wix-cli-for-sites/about-git-integration-wix-cli-for-sites.md) (Wix Studio and Wix Editor).

You can [import JSDoc](https://dev.wix.com/docs/develop-websites/articles/workspace-tools/velo-workspace/code-editor-ide/import-jsdoc.md) only in the editor.

## JSDoc tags and definitions
JSDoc tags are added to JavaScript files as comments.

Each line of JSDoc defines an item using the following format:
```js
 /**
 * @<jsdoc-tag> {<type>} <item-name> <description>
 */
```

<details>
<summary>JSDoc tags</summary>

| Variable | Description |
| -------- | ----------- |
| `jsdoc-tag` | [JSDoc tag](https://jsdoc.app/) that defines what the item is. <br>For example, use `@typedef` to define a new type, `@property` to define the property of an object, and `@param` to define a parameter. |
| `type` | Data type of the item. For example, `object`. |
| `item-name` | How the item is referred to. |
| `description` | Description of the item. <br>Optional. |

</details>

### Where to add JSDoc in your code
You can add JSDoc to Velo code as you would to any JavaScript code, by including the annotations just above the code you are documenting. However, when defining a parameter type, using the `@param` tag, place the JSDoc definition directly above the function declaration.

#### JSDoc example
In the following example, we define an `employee` type that is then applied to a function parameter.

```js
/**
 * @typedef {object} employee
 * @property {string} name Employee's name.
 * @property {number} seniority The number of years the employee has worked at the company.
 * @property {number} hours The number of hours the employee works a week.
 *
 * @param {employee} employee
 */
export function salaryCalculator(employee) {
  return `Salary for ${employee.name}: ${employee.hours * employee.seniority * 100}`;
}
```

## Type checking and autocomplete
When you apply JSDoc types to parameters, the editor can perform type checking and provide autocomplete suggestions for function arguments.

![](https://wixmp-833713b177cebf373f611808.wixmp.com/images/using-js-doc-md_velo-articles_velo-workspace_images_typecheck-jsdoc.png)

![](https://wixmp-833713b177cebf373f611808.wixmp.com/images/using-js-doc-md_velo-articles_velo-workspace_images_autocomplete-jsdoc.png)

## File types
You can add JSDoc in any JavaScript file, meaning the file's suffix is `.js`. This includes JavaScript files in Velo packages, allowing anyone using your packages to use type checking and autocomplete.

You can import types defined by Wix in some specific file types. 
For example, you can import backend event objects to [`events.js` files](https://dev.wix.com/docs/develop-websites/articles/coding-with-velo/backend-code/events/about-backend-events.md).

<blockquote class="important">
  <strong>Important:</strong> <a href="fallback::https://dev.wix.com/docs/develop-websites/articles/coding-with-velo/backend-code/web-modules/about-web-modules">Web.md modules</a> (files with the suffix `.jsw`) support autocomplete, but not type checking.
</blockquote>

## See also
- [Import JSDoc](https://dev.wix.com/docs/develop-websites/articles/workspace-tools/velo-workspace/code-editor-ide/import-jsdoc.md)