DONATE  
MENU
HTML
AJAX
PHP
CSS
JAVASCRIPT
JSON
MYSQL

JavaScript Tutorials

INTRODUCTION

» Introduction to JavaScript

» Practice IT Editor

» JavaScript Example

» JavaScript Placement

» JavaScript Syntax

» JavaScript Statements

» JavaScript Input

» JavaScript Output

» JavaScript Comments

» JavaScript Variables

» Variables' Scope

» JavaScript Operators

» JS Expressions & Concatenation

» JavaScript Data Type

» JavaScript Numbers

» Number Object

» JavaScript Strings

» String Object

» JavaScript Booleans

» Boolean Object

» JavaScript Functions

» JavaScript Arrays

» Array Object - Properties

» Array Object - Methods

» JavaScript Objects

» JavaScript Undefined

» JavaScript Nulls

CONDITIONAL TESTING

» If Statement

» If Else Statement

» JavaScript Ternary Operator

» Switch Statement

LOOPS

» For Loops

» While Loops

» Break & Continue

» For...In Loops

» do...while Loop

FUNCTIONS

» JavaScript Functions

» Creating Functions

» Functions' Parameters

» Functions' Arguments

» Function Invocation

» The Return Keyword

» The Arguments Object

» Callback Functions

» Arrow Functions

ARRAYS

» JavaScript Arrays

» Creating Arrays

» Accessing Arrays

» Looping Arrays

» Multi - dimensional Arrays

OBJECTS

» JavaScript Objects

» Creating Objects

» Prototype Definition

» Accessing Objects

» The this Keyword

AJAX

» Introduction to AJAX

JSON

» Introduction to JSON

JAVASCRIPT DATES

» The Date Object

» Date Methods

» Timing (SetInterval & SetTimeout)

MATH OBJECT

» Math Object

» Math Methods

HTML / JS DOM

» DOM Introduction

» Accessing HTML Elements in DOM

» Get And Change Elements' Contents & Values

» Change Styling - DOM CSS

» DOM Attributes

» JavaScript Event Listeners

» DOM Event Listeners

» JS Events

MISCELLANEOUS

» JS Strict Mode

» JavaScript Hoisting

» JavaScript let keyword

» Reserved Keywords

» JS Best Practices

» JavaScript vs ECMAScript

JAVASCRIPT EXAMPLES

» JavaScript Calculator

.. » JavaScript » Miscellaneous » JS Best Practices
Share Tweet WhatsApp

JS Best Practices

Below are some good JavaScript best practices to observe while writing programs. They help in numerous ways and most especially in writing clean codes that are readable by both us, the authors and others.
  • Always declare variables before usage.
  • To help with the above, it is advisable to declare all the variables in a program scope at the top of the scope before commencing to use them.
    var num1;
    var num2;
    //statements
    function (num1, num2){
    var sum;
    var difference, factor;
    //statements
    }
    //statements
  • Initialize variables immediately after declaration. Even when the values for such variables are not yet ready, you can use default initializations according to expected values.
    var num = 0; //number
    var str = ""; //string
    var bool = false; //boolean
    var arr = []; //array
    var obj = {}; //object
    var func = function(){}; //function
    This reduces cases of undefined variables which may in some cases lead to non execution of your program.
  • Initialize function parameters with default values so that when no argument is assigned, the default is used. This is mostly important when the parameter (s) is essential for the proper execution of the function.
    function (num1, num2){
    if (num1 !== undefined){
    num1 = num1;
    }
    else
    {
    num1 = 0;
    }
    //SAME AS
    num2 = (num2 !== undefined? num2 : 0);
    }
  • Create explicit or literal values always except when really necessary to create implicit or object ones. THIS
    var sum = 3 + 4;
    INSTEAD OF
    var sum = new Number(3) + new Number(4);
  • Give variables and functions descriptive names. That is, names that describe their content or what they do in a program. THIS
    var height = "1.5m";
    function changeHeight(){
    }
    INSTEAD OF
    var x = "1.5m";
    function myFunc(){
    }
  • It is a usual practice to use the camelCase system in naming or writing JS variables' names. This system entails that if a variable contains a single word, it should be in lowercase but if it contains more than one word, the first word should be in small letters while the first character of the rest should be capitalized.
    var sum;
    var newPersonHeight;
    Though in this tutorial, we might have used some other naming systems but then, the camelCase system is highly recommended in JS.
  • The name of a class or constructor function(prototype) should start with a capital letter.
    //constructor function
    function Person(){
    }
    var person1 = new Person();
    //class
    class Car{
    }
    var mercedenz = new Car();
  • Make good use of commenting. Comment any complex task or not basic task in your program. You can also write a comment on the use of a variable's value.
    "use strict"; //To enable JS stict mode
  • Do not confuse = for == or ===. = is an assignment operator used to assign a value to a variable while ==(equal to) compares two variables/values to check if they are same values. The === checks if two variables/values contains same values and are of same data type.
  • Always end your statements with semicolons(;). THIS
    var name;
    INSTEAD OF
    var name
  • The name of constant variables should be capitalize.
    const BASE_URL = "http://www.stackbeginner.com";
Take a short quiz on JS Best Practices.
Ask a question or tell us if JS Best Practices is easy or not.
cent?

Join our 1,090 subscribers to receive tutorials' updates!

  We won't spam your mail box. We hate it.





StackBeginner 2021 © Joseph Omamode