Developer Tools

JavaScript Variable Generator

Write variables as simple name = value lines and get clean JavaScript declarations. Names are converted to camelCase, UPPER_SNAKE_CASE or snake_case, values are written as proper literals with your preferred quotes, JSDoc comments document their types, objects and arrays can be frozen, and everything can be exported or grouped into one configuration object.

  • Runs in your browser
  • No sign-up
  • Free to use
Start from an example

Values can be numbers, true/false, null, "text", or JSON arrays and objects. Names may contain spaces; they are converted to the naming style below.

Options

    How to use JavaScript Variable Generator

    1. Enter one variable per line as name = value.
    2. Choose const, let or var and the naming style.
    3. Pick JSDoc, freezing, export and grouping options.
    4. Copy or download the JavaScript.

    JavaScript Variable Generator features

    Naming conventions

    camelCase, UPPER_SNAKE_CASE, snake_case or as written.

    Proper literals

    Numbers, booleans, null, strings and JSON objects and arrays.

    JSDoc types

    Inferred types such as string[] or {darkMode: boolean}.

    Immutability

    Object.freeze for objects and arrays declared with const.

    Config object

    Group all values into one exported, frozen object.

    Helpful warnings

    Notes about var, shallow freezing and unquoted text.

    When to use JavaScript Variable Generator

    • Turning a list of settings into a constants module.
    • Creating initial state variables for a component.
    • Converting environment values into a typed config object.
    • Teaching or learning JavaScript declaration styles.

    JavaScript Variable Generator FAQ

    Should I use const or let?

    Use const by default and let only for variables that are reassigned. const prevents accidental reassignment; it does not make objects immutable.

    When are UPPER_SNAKE_CASE names used?

    For module-level constants whose values never change, such as API_URL or MAX_RETRIES. Normal variables and objects use camelCase.

    What does Object.freeze do?

    It prevents adding, removing or changing properties of an object. It is shallow, so nested objects stay changeable unless they are frozen too.

    How are values written?

    Valid JSON is used as is, single-quoted strings are accepted, plain numbers become numbers and anything else becomes a string. Notes list values that were treated as text.

    Why add JSDoc types?

    Editors such as VS Code read JSDoc to offer autocompletion and type checking in plain JavaScript files.

    Is anything uploaded?

    No. The code is generated in your browser.

    Declaring variables well

    Modern JavaScript has three ways to declare a variable. var is function-scoped and can be redeclared, which causes subtle bugs, so it survives mostly in old code. let is block-scoped and can be reassigned. const is block-scoped and cannot be reassigned, which makes code easier to reason about; most style guides recommend it for everything that does not need to change.

    Naming carries meaning too. camelCase is the standard for variables and functions. UPPER_SNAKE_CASE marks true constants, values fixed for the life of the program such as limits and URLs, and is usually used at module level. The generator converts names written with spaces, dashes or other casing into the chosen style and adds an underscore when a name would collide with a reserved word.

    Values are written as literals rather than evaluated. Text that is valid JSON becomes the corresponding number, boolean, null, array or object; single-quoted strings are accepted; and any remaining text is treated as a string, with a note so that nothing is converted silently. Objects are printed with unquoted keys where possible and arrays stay on one line when short.

    const only protects the variable, not the object it refers to. Object.freeze makes an object’s own properties read-only, which suits configuration that should never change at runtime. Because freezing is shallow, the notes point out when nested objects remain changeable.

    JSDoc comments add type information that editors and TypeScript’s checkJs mode understand, without a build step. For a set of related values, grouping them into one exported object, such as config, keeps imports tidy and makes the configuration easy to find.

    Other useful tools