When to use pascal case in javascript

const toPascalCase = str =>
  str
    .match(/[A-Z]{2,}(?=[A-Z][a-z]+[0-9]*|\b)|[A-Z]?[a-z]+[0-9]*|[A-Z]|[0-9]+/g)
    .map(x => x.charAt(0).toUpperCase() + x.slice(1).toLowerCase())
    .join('');

toPascalCase('some_database_field_name'); // 'SomeDatabaseFieldName'
toPascalCase('Some label that needs to be pascalized');
// 'SomeLabelThatNeedsToBePascalized'
toPascalCase('some-javascript-property'); // 'SomeJavascriptProperty'
toPascalCase('some-mixed_string with spaces_underscores-and-hyphens');
// 'SomeMixedStringWithSpacesUnderscoresAndHyphens'

When to use pascal case in javascript

When to use pascal case in javascript

Prahlad Yeri

Posted on Jul 10, 2019 • Updated on Jul 11, 2019

The various tokens in your code (variables, classes, functions, namespaces, etc.) can be named using one of these three styles, broadly speaking:

  1. Camel Case (ex: someVar, someClass, somePackage.xyz).
  2. Pascal Case (ex: SomeVar, SomeClass, SomePackage.xyz).
  3. Underscores (ex: some_var, some_class, some_package.xyz).

In camel casing, names start with a lower case but each proper word in the name is capitalized and so are acronyms. For example, commonly used tokens in many languages such as toString, checkValidity, lineHeight, timestampToLocalDateTime, etc. are all examples of camel casing.

Pascal casing is similar to camel casing except that the first letter also starts with a capital letter (SomeClass instead of someClass).

In underscore casing, everything is in lower case (even acronyms) and the words are separated by underscores (some_class, some_func, some_var, etc). This convention is also popularly known as snake case.

The general idea is that you can use any convention in your project as long as you are consistent about using it everywhere. But when you code for a large project or team, you should conform to the norm of what is being used there. Hence, its helpful to be aware of the conventions typical in various programming languages.

The general practice for a C style language like Java or JS is to use camelCase for all variables and object members (properties & methods), and PascalCase for class names and constructors. Namespaces (or Packages in Java world) are usually in camelCase.

But some languages make an exception to that. C#, for example, uses PascalCase for namespaces and even public methods. Hence, the main function (or entry point) is always static void main() in java but static void Main() in C# (Note the capitalization of the word "Main").

Some languages which don't derive their syntax from C (such as Python & Ruby) use underscores for almost everything except class names. Hence, its always sys.base_prefix instead of sys.basePrefix, datetime instead of DateTime, str.splitlines() instead of str.splitLines() in python.

In case of python's standard library, I've noticed that even the classes use underscores sometimes which is an inconsistency. For example, datetime.datetime is a class and so is csv.excel_tab. The popular frameworks and libraries though (such as django and flask) use the camel case for classes.

Similar inconsistency is in PHP. The language is evolving from underscores to camel casing in recent years but some old tokens still haunts that language. For ex, mysqli::set_local_infile_default vs PDOStatement::debugDumpParams.

So, ultimately, it comes down to your own preference when you are starting a project. But it helps to know what are the usually followed conventions in popular open source projects in the language of your preference.

Update

There is a fourth case too as pointed out by @ovais , namely kebab case. Its very much like underline casing except that the underlines are replaced with hyphens (dashes). So, some_func becomes some-func which is obviously disallowed because dash isn't used for naming tokens as its already a built-in for the minus operator in most programming languages. Where kebab case is used most frequently is for creating classes in your css stylesheets! Names like main-div, main-navbar and article-footer are commonly used by web developers while writing their HTML/CSS. This convention is basically the kebab case.

Update

As @patrykrudnicki says, constants are handled differently. In my experience, the full underscores (SOME_CONST) is a popular convention for constants in many languages including Java, PHP and Python.

Update

To summarize, this is the typical or generally followed convention in the most used open source programming languages:

TokenpythonJava/JSPHP
variable under_score camelCase mix (moving towards camelCase)
function under_score() camelCase() mix (moving towards camelCase())
constant UNDER_SCORE UNDER_SCORE UNDER_SCORE
class PascalCase PascalCase mix (moving towards PascalCase)
namespace under_score camelCase mix (moving towards PascalCase)

Some helpful links:

  1. https://softwareengineering.stackexchange.com/questions/196416/whats-the-dominant-naming-convention-for-variables-in-php-camelcase-or-undersc
  2. https://stackoverflow.com/questions/149491/pascal-casing-or-camel-casing-for-c-sharp-code
  3. https://www.c-sharpcorner.com/forums/when-to-use-camel-case-and-pascal-case-c-sharp
  4. https://softwareengineering.stackexchange.com/questions/53498/what-is-the-philosophy-reasoning-behind-cs-pascal-casing-method-names

Should I use Pascal case?

In most development environments, the use of Pascal case versus camel case is a convention, not a necessity. Code will still compile and run, regardless of which naming convention is used. The proper use of Pascal case and camel case is intended to make code more readable and maintainable.

Does JavaScript use Pascal case?

PascalCase: PascalCase is often preferred by C programmers. camelCase: camelCase is used by JavaScript itself, by jQuery, and other JavaScript libraries.

What is Pascal case used for?

Pascal case -- or PascalCase -- is a programming naming convention where the first letter of each compound word in a variable is capitalized. The use of descriptive variable names is a software development best practice. However, modern programming languages do not allow variables names to include blank spaces.

Should I use camelCase in JavaScript?

Naming Convention for Variables However, the most recommended way to declare JavaScript variables is with camel case variable names. You can use the camel case naming convention for all types of variables in JavaScript, and it will ensure that there aren't multiple variables with the same name.