No internet connection
  1. Home
  2. How to

Using @param

By samuel henriques @samuel_henriques
    2021-03-28 22:31:35.291Z

    When and why should this be used:
    Ex:

    /**
     * @param {1|2|3|4|5|6|7|8|9|10} insertNumber
     * @param {'Bypass'|'Active'} toggleType
     */
    

    Thank you so much.

    • 5 replies
    1. Kitch Membery @Kitch2021-03-28 23:14:26.176Z

      Good question @samuel_henriques,

      This is called JSDoc referred to as typeDef (Type Definition).

      It is used for adding information to the code.

      It also makes it so that the code hinting works as expected

      This comes in handy once you start using export/require to hold your functions in external library scripts.

      So for example try this...

      Create a "new" blank script, and add the following code;

      function myfunction(myArg){
          myArg.
      }
      
      const testString = 'This is a string';
      
      myfunction(testString);
      

      You'll notice that after you type myArg. inside the function, no code hints for displaying string methods appear.

      However, when you declare the Type Definition for myArg with JSDoc like this;

      /**
       * @param {string} myArg
       */
      function myfunction(myArg){
          myArg.
      }
      
      const testString = 'This is a string';
      
      myfunction(testString);
      

      ...code hints will then show up :-)

      You can find more information at the following link;

      https://jsdoc.app/

      Hope that helps :-)

      1. Kitch Membery @Kitch2021-03-28 23:19:53.827Z

        Here is a link to the @param documentation

        https://jsdoc.app/tags-param.html

        To start writing typeDef information in the editor, type /** and press return.

        :-)

        1. In reply toKitch:
          Kitch Membery @Kitch2021-03-29 00:22:07.855Z

          To explain the @param tags that you supplied as an example,

          /**
           * @param {1|2|3|4|5|6|7|8|9|10} insertNumber
           * @param {'Bypass'|'Active'} toggleType
           */
          

          The function would look something like this;

          /**
           * @param {1|2|3|4|5|6|7|8|9|10} insertNumber
           * @param {'Bypass'|'Active'} toggleType
           */
          function myFunction(insertNumber, toggleType){
               //Function contents
          }
          

          The line @param {1|2|3|4|5|6|7|8|9|10} insertNumber means that the parameter or argument insertNumber will accept any of the numbers 1-10 only.

          The line @param {'Bypass'|'Active'} toggleType means that the parameter or argument toggleType will accept the strings 1-10 'Bypass' or 'Active' only,

          For the example I gave, the line @param {string} myArg means that the parameter or argument myArg will accept a value with the type strings only.

          This can be applied to objects, callbacks returns, type, and much more.

          Using JSDocs make it easier to read code when you come back to it after a while.

          Let me know if you have any specific questions about JSDoc and I'll see if I can answer them for you. :-)

          1. samuel henriques @samuel_henriques
              2021-03-29 09:19:32.136Z

              cool, thank you Kitch, I'll need a bit to digest this and let you know when I get stuck.

              You Rock Master Kitch!

              1. Kitch Membery @Kitch2021-03-29 09:25:54.147Z

                Back at ya legend! :-)