JavaScript Tutorial
JS - Introduction JS - Basic JS - Placement JS - Output JS - Statements JS - Syntax JS - Variables JS - Comments JS - Data Types JS - Operators JS - Operator Precedence JS - Condition JS - Switch JS - Functions JS - Objects JS - Loops For JS - Loops While JS - Break JS - Strings JS - String Methods JS - Numbers JS - Number Methods JS - Arrays JS - Array Methods JS - Array Iteration JS - Events JS - Event Listener JS - Event Propagation JS - Date JS - Math JS - Random JS - Boolean JS - Type Conversion JS - RegExp JS - Exception JS - Scope JS - Debugging JS - Hoisting JS - Strict Mode JS - this Keyword JS - Mistakes JS - Best Practices JS - Performance JS - Form Validation JS - ES6 Features
JS Objects
Object Definitions Object Properties Object Methods Object Constructors Object Prototypes
JS Functions
Function Definitions Function Parameters Function Call Function Apply Function Closures
JS HTML DOM
DOM Introduction DOM Methods DOM Selectors DOM HTML DOM CSS DOM Attributes DOM Navigation
JS Browser BOM
JS - Window JS - Screen JS - Location JS - History JS - Navigator JS - Popup Alert JS - Timing JS - Cookies
JS AJAX
AJAX - Introduction AJAX - XMLHttp AJAX - Request AJAX - Response AJAX - PHP
JS JSON
JSON - Introduction JSON - Syntax JSON - Data Types JSON - Parse JSON - Stringify JSON - Objects JSON - Arrays JSON - PHP JSON - JSONP
JS References
JavaScript Reference JavaScript Methods HTML DOM Reference

JavaScript Common Mistakes

JavaScript is one of the most popular programming languages in today’s industry. If you wish to dive into this language, here are a few mistakes to avoid.


Accidentally Using the Assignment Operator

JavaScript programs may generate unexpected results if a we accidentally uses an assignment operator (=), instead of a comparison operator (==) in an if statement.

This if statement returns false because num is not equal to 20:

Run code

This if statement returns true, because 20 is true:

Run code

An assignment always returns the value of the assignment.


Using “==” instead of “===”

This is probably the most common mistake when people start with JavaScript.

In regular comparison, data type does not matter. This if statement returns true:

Run code

In strict comparison, data type does matter. This if statement returns false:

Run code

The difference between (a==b) and (a===b) is:

  • == returns true if a is equal to b
  • === returns true if a is equal to b, and they are of the same type

In general, you should always use the === also known as the Strict Equality Operator or Identical Operator.


Confusing Addition & Concatenation

As you know from the previous chapters, the + operator is used for both addition and concatenation.

Addition is about adding numbers.

Concatenation is about adding strings.

Because of this, adding a number as a number will produce a different result from adding a number as a string:

Run code

Misunderstanding Floats

All numbers in JavaScript are stored as 64-bits Floating point numbers (Floats).

All programming languages, including JavaScript, have difficulties with precise floating point values:

Run code

To solve the problem above, it helps to multiply and divide:

Run code

Breaking a JavaScript String

JavaScript will allow you to break a statement into two lines:

Run code

But, breaking a statement in the middle of a string will not work:

Run code

You must use a "backslash" (escape character) if you must break a statement in a string:

Run code

Another solution is the use template literal (` `) strings. These eliminate the need for escaping on long strings:

Run code

Misplacing Semicolon

Because of a misplaced semicolon, the following code will execute regardless of the value of num:

Run code

Ending Definitions with a Comma

Trailing commas in object and array definition are legal in ECMAScript 5.

However, by adding trailing commas Internet Explorer 8 will crash.

JSON does not allow trailing commas.


Thinking there is block-level scope

JavaScript does not create a new scope for each code block.

It is true in many programming languages, but not true in JavaScript.

Run code

Use let keyword to create a new scope for each code block:

Run code

Difference between Null and Undefined

The undefined value indicates that a variable has not been assigned a value, or not declared at all.

The null value represents the intentional absence of any object value.

This can make it a little bit difficult to test if an object is empty.

You can test if an object exists by testing if the type is undefined:

Run code

But you cannot test if an object is null, because this will throw an error if the object is undefined:

Run code

To solve this problem, you must test if an object is not undefined, and not null:

Run code