Northcentral Technical College Introduction To Programming
10-152-310
Introduction to Programming with JavaScript NTC 10-152-310

Learning Plan 5 JavaScript Coding Standards

# JavaScript Coding Standards for 10-152-310

- Here are the coding standards for the course and a screencast overview. Your projects and labs will be graded partially on conformance to these rules. This document will be expanded as the semester progresses. The accompanying screencast is at the bottom page.

- 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.

### 1. Indentation

- The unit of indentation of JavaScript source code will be four (4) spaces. Do not use the tab character. The course editor (jEdit) has been configured so that when you press the tab key it will insert 4 spaces instead of a tab. Keep this setting and if you use another text editor make sure you are not inserting tab characters into your code.

### 2. 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. The course editor has been configured to show a vertical line at column 80 to help you with this standard:

### 3. 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!

1. The student's name, section, and email at the top of lab and project files.
2. All functions need to have a block of comments describing what the function does. More details later when we get to functions.
3. All loop constructions will have a comment block immediately preceding the loop. The comments should describe what the loop accomplishes.
4. All difficult or confusing sections of code should have a preceding comment which explains the code.

### 4. Constant Declarations

- Constants must be declared before variables and labelled.
- Constants use the `var` statement like variables.
- Constants names will be in uppercase letters only.
- Multi-word constants will use the underscore `(_)` to separate words.
- Constants are always assigned their values when they declared.
- Examples:
- All labs and projects must use constants for all values that are fixed and don't change while the program runs. Examples of these include:
- Loops must be constructed with constants for the loop maximum value as in the following example:

### 5. Variable Declarations

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

1. Variables must follow the naming conventions outlined below.
2. All variables must be declared before they are used. Many programming languages require this as part of their syntax. However, JavaScript does not require this so you need do this intentionally.
3. `var` statements must be at the top of your JavaScript code and functions, right after the constant declarations.
4. Every variable must be declared on its own line.

### 6. Calculations and Variables

- The results of all calculations must be assigned to a variable. No calculations may be performed inside a document.write() method except concatenation and `typeof`. Here's an example:
- All calculations must be performed with variables only. No hard-coded numbers are allowed in calculations.

### 7. Function Declarations

> Here are the new standards for functions.

- All functions must be declared in an external file, no functions are allowed in the HTML document.
- All functions must be declared before they are used. This is an important performance standard, not JavaScript syntax. Your code will run without conformance with this standard so care must be taken to follow it.
- There should be no space between the name of a function and the "(" (left parenthesis) of its parameter list. There should be one space between the ")" (right parenthesis) and the "{" (left curly brace) that begins the body of the function. The statements comprising the body of the function itself are indented four spaces. The "}" (right curly brace) is vertically aligned with the line containing the beginning of the declaration of the function (i.e. with the "f" in the word "function".)
- `return` Statement
  - If used, a return statement with a value should not use `( )` (parentheses) around the value. The return value expression must start on the same line as the return keyword in order to avoid semicolon insertion.

### 8. 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:

1. Names must be created with the 26 upper and lower case letters (A..Z, a..z) and the 10 digits (0..9).
2. Do not use the underscore "_", the dollar sign "$", or slashes "/ \" in variable names.
3. Variables and functions must start with a lower case letter.
4. Variables must not have names that are 1 or 2 characters in length. (There are a few exceptions that we'll see in looping.)
5. Constructor plain functions must start with an upper case letter.
6. Constants must be in ALL CAPS.
7. Abbreviations must 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.
8. Names, other than constants, 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:

### 9. 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.
- Examples
- Exceptions to the rule
  - There are some statements that should not have semicolons. These are usually compound statements like this:
  (note that the curly brace that ends the entire IF-ELSE structure is written with no semicolon following it)

### 10. 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.

- Every simple statement must end with a semicolon.
- Every simple statement must be on it own line. This code will work but it fails the course standards in a couple of ways:
- On line 1 there are two statements. JavaScript doesn't care but your instructor and future professional teammates will.
- On line 3 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:
- Compound statements are different than simple statements. They are statements that contain lists of other statements enclosed in curly braces "{}".
  - Enclosed statements should be indented
  - The left { should be at the end of the line that starts the compound statement.
  - The right } should begin a line and should match the beginning of the compound statement.
  - Braces ( {} ) should be used on all enclosed statements, even if there is only one enclosed statement.
  - Here's an example using if statements:

### 11. 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.
- Blank spaces should be use like this:
  - A keyword followed by a left parenthesis "(" should be separated by a space.
- Most operators should have a space on either side.
- A space should follow every comma ","
- The dot operator (`.`) must NOT have spaces on either side of it.
- Unary operators must NOT have spaces around them.