Webolution Designs

JavaScript Coding Standards

Share This Post

One of the most important aspects of modern programming is readability. To be able to read code written by other people and understand it has become much more important than having condensed, optimal code. Modern programming languages can optimize your code better than you can. So, the number one criteria for the way we write is for other human beings to read it. These standards are about readability, making your could as readable as possible.

The following are examples of some JavaScript coding standards…

Indentation

The unit of indentation of JavaScript source code will be four (4) spaces.

Line Length

Avoid making any line of JavaScript code more than 80 characters. This improves readability. Sometimes this can’t be avoided but when possible it is required to have 80 or fewer characters in a line of code.

Line Length Example

Comments

Good documentation will be required in your labs and projects files. Here is a minimal list of what the instructor will be looking for. Quality counts!

  • The student’s name, section, and email at the top of lab and project files.
  • Planning Lists – There are some exercises which will have a section for you to think through the coding process. These are required.
  • Test Plans – These sections are areas where you will be able to list what are the expected behaviors of your code. These are required.

Variable Declarations

Good variable naming and usage is very important when learning to program computers. Here is a list of the rules for variables:

  • Variables must follow the naming conventions outlined below.
  • All variables must be declared before they are used. Many programming languages require declaration as part of their syntax. However, JavaScript does not require this so you need do this intentionally.
  • Variable declarations should be at the top of your JavaScript code and functions.

Naming Conventions

How things are named in a computer program is very important. In the early days of programming names were very short and cryptic to save on RAM usage. You may have seen variables with names like “i”, “fnme”, and “cal_prc”. These days our computers all have lots and lots of RAM and we can stop this old confusing habit. Here are the course rules for naming things:

  • Names should be created with the 26 upper and lower case letters (A..Z, a..z) and the 10 digits (0..9).
  • Do not use the underscore “_”, the dollar sign “$”, or slashes “/ \” in names.
  • Variables should start with a lower case letter.
  • Abbreviations should be avoided, use complete words wherever possible, which is the vast majority of the time. What does “cal_prc” mean? Calculate Price? Calculate Percentage? Calender Perfection? Names need to be very clear, for others and for you. You won’t remember your own cryptic names in the future.
  • Names that have more than one word should use the “camel case” convention. The name starts with a lower case letter and then each new word in the name starts with an upper case letter. Examples:
  • [code lang=”js”]
    // Good Names
    var firstName;
    var totalPrice;
    var totalPriceForRedWidgets;
    var customerCodeForNewNonUsRetailCustomer;
    // do programmers
    // really do this?
    // yes, we do
    [/code]

Semicolons

Semicolons are used in JavaScript to end a line. Most of the time they are not required by JavaScript. However, they are required in a few places so as a course standard, that is also a convention in the industry, the use of semicolons at the end of statements is required.

[code lang=”js”]
// Use of semicolons
var name = "Fred";
return name;
total = total + 100;
[/code]

Statements

The way we write statements is critical for code that is readable and easy to understand. Here is how we’re going to write JavaScript statements.

Simple Statements

  • Every simple statement must end with a semicolon.
  • Every simple statement must be on its own line. This code will work but it fails the course standards in a couple of ways:

    [code lang=”js”]
    // WRONG WAY!
    var name = "Fred";
    var city = "Madison";
    document.write(name + ", " + city)
    [/code]

  • On line 3 there are two statements. JavaScript doesn’t care but your instructor and future professional teammates will.
  • On line 5 the statement is missing the semicolon at the end. JavaScript won’t remind you to put them there. You will just have to get in the habit.
  • Here’s the correct version:
  • [code lang=”js”]
    // Right way!
    var name = "Fred";
    var city = "Madison";
    document.write(name + ", " + city);
    [/code]

Whitespace

Whitespace can improve the readability of code. Here are the course standards for whitespace.

  • Use blank lines liberally, your code shouldn’t be all bunched together.
  • Most operators should have a space on either side.

    [code lang=”js”]
    // Operator spacing
    var name = "Fred";
    var x = 1;
    x = x + 1;
    [/code]

  • A space should follow every comma “,”
  • A blank line should separate sections of your code.

Happy Coding!

Clay

Subscribe To Our Newsletter

Get updates and learn from the best

More To Explore

Code

Curriculum Innovation or Confusion

It is an early Monday morning just prior to the beginning of the semester.  A faculty member walks into the institution where he teaches.  He

Code

Creating a Promise

Promises are used for asynchronous code. It is a temporary holder for a value that gets returned by an asynchronous call. For example, a call

Do You Want To Boost Your Business?

drop us a line and keep in touch

Excuse Our Mess! We are currently remodeling!

We are currently in the process of redesigning our site. We appreciate your patience as some areas of our site show chipping and paint peeling. We hope to have it sparkling soon!

small_c_popup.png

Learn how we helped 100 top brands gain success.

Let's have a chat