Javascript Code Standards

Naming Conventions

All variables, functions, and classes should all have meaningful names:

// do not do this
var f = "Aaron";

// do this
var first_name = "Aaron";

Local Variables

Local variable names should all be lower case:

var email;

If the local variable name is made up of multiple words, use snake case:

var email_address;

Strings

Strings should be enclosed in double quotes ("):

var user_name = "Aaron";

String Concatenation vs. Variable Injection

String concatenation is discouraged. Instead, enclose your strings that require variable injections in backticks (`) and place the variable using ${} notation:

// do not do this:
var message = user_name + " has logged out of the system.";

// do this:
var message = `${user_name} has logged out of the system.`;

Functions

Function names should all be lowercase:

update

If the function name is made up of multiple words, use snake case:

update_by_id

Classes

Class names should all be capitalized:

class Vertical {

    constructor() {

        // code goes here
    }
}

If the class name is made up of multiple words, use Pascal case:

class VerticalGroup {

    constructor() {

        // code goes here
    }
}

Function Definitions

Function definitions should all be full definitions with no shorthand/arrow notation:

function function_name(parameter_1, parameter_2) {

    // code goes here
}

In-line Callbacks

In-line callbacks should utilize shorthand/arrow notation:

button.addEventListener("click", (event) => {

    event.preventDefault();

    // code goes here
});

If the in-line callback is a reusable block of code, create a function for the reusable block if it doesn't already exist and use the function name instead of shorthand/arrow notation:

function validate_form_fields(event, form_fields) {

    event.preventDefault();

    // code goes here
}

form.addEventListener("submit", validate_form_fields(event, form_fields));

event vs. e

Do not simply type "e" for an event. Completely type out "event":

// do not do this:
button.addEventListener("click", (e) => {

    e.preventDefault();
});

// do this:
button.addEventListener("click", (event) => {

    event.preventDefault();
});