Are you a newbie in tech? Are you new to programming with JavaScript? This blog is for you! Here I will talk about naming conventions of identifiers in JavaScript and I’ll make this blog as simple as possible without much mumbo-jumbo. First of all, what are identifiers in programming? Identifiers are naming words assigned to different containers of data such as variables, objects, functions, components etc. As the name implies they are used to identify these containers as they are used in programming. For example, say I want to create a variable to store the first name of a user, this is what it would look like in JavaScript.

const firstName = 'Ifeanyi';

All identifiers in JavaScript have rules that MUST be followed when creating them such as:

• Identifier names must start with either a letter, an underscore _, or the dollar sign $.

//valid
const a = 'hello';
const _a = 'hello';
const $a = 'hello';

• Identifier names cannot start with numbers. For example,

//invalid
const 1a = 'hello'; 
console.log(1a) // this gives an error

• JavaScript is case-sensitive. So y and Y are different identifiers. For example,

const y = "hi";
const Y = 5;
console.log(y); // hi
console.log(Y); // 5

• Keywords cannot be used as identifier names. For example,

//invalid
const new = 5; // Error! new is a keyword.

Note: While you can name your identifiers with anything, it’s best to use descriptive names for example,

//good
const firstName = 'Ana';
//bad
const val = 'Ana';

And those are the rules in naming identifiers in JavaScript, now for the Naming Conventions. Naming Conventions are NOT rules you must follow when building programs but are recommended. They are style guidelines in programming which include rules for naming identifiers, use of white space, indentation, comments and best practices in programming but for the sake of this blog we’ll only cover the guidelines for naming identifiers.

Why do we need naming conventions in programming?

We need naming conventions to guide us programmers to build readable and maintainable code because we collaborate a lot on projects and you don’t want to come across files from different programmers where they define variables and functions in ways that are so abstract and confusing you’d have to trace where the variable or function was declared to know if it was even a variable or a function, heck you’d even wonder if you’re all coding in the same programming language. So to prevent situations like this naming conventions were created to provide guidelines that all JavaScript programmers should follow and they are:

• Use camelCase when naming variables, arrays, objects and functions. For example,

//good
var firstName = 'Ana';
//bad
var firstname = 'Ana';
var first-name = 'Ana'; //NEVER USE A HYPHEN IN JAVASCRIPT
var first_name = 'Ana';

• A JavaScript variable should be self-descriptive. For example,

//good
var animal = 'cat';
//bad
var x = 'cat';

• Use a prefix like is, are, or has helps every JavaScript developer to distinguish a boolean from another variable by just looking at it:

//good
var isVisible = true;
//bad
var visible = true;

A JavaScript class is declared with a PascalCase in contrast to other JavaScript data structures:

class SoftwareDeveloper {
constructor(firstName, lastName) {
this.firstName = firstName;
this.lastName = lastName;
}
}
var me = new SoftwareDeveloper('Ifeanyi', 'Aladi');

• Components are not everywhere in JavaScript, but commonly found in frontend frameworks like React. They are widely declared with Pascal Case.

// bad
function userProfile(user) {
return (
<div>
<span>First Name: {user.firstName}</span>
<span>Last Name: {user.lastName}</span>
</div>
);
}

// good
function UserProfile(user) {
return (
<div>
<span>First Name: {user.firstName}</span>
<span>Last Name: {user.lastName}</span>
</div>
);
}

NOTE: When a component gets used, it distinguishes itself from native HTML and web components, because its first letter is always written in uppercase.

• Last but not least, there are constants — intended to be non-changing variables — in JavaScript which are written in capital letters (UPPERCASE):

var PI= 3.14;
var r = 7;
var areaCircle= PI * r^2;

And that's a wrap! Thank you for reading and I hope you've picked up a few tips in JavaScript Development.

Thank you and Good Luck!