Javascript - Increment/Decrement Operators

Introduction

The increment and decrement operators come in two versions: prefix and postfix.

The prefix operators are placed before the variable; the postfix ones are placed after the variable.

To use a prefix increment, which adds 1 to a numeric value, you place two plus signs (++) in front of a variable like this:

var myInt = 29; 
++myInt;

In this example, the prefix increment changes the value of myInt to 30.

This is effectively equal to the following:

var myInt = 29; 
myInt = myInt + 1;

The prefix decrement acts in a similar manner, subtracting 1 from a numeric value.

To use a prefix decrement, place two minus signs (--) before a variable, as shown here:

var myInt = 29; 
--myInt;

When using either a prefix increment or a prefix decrement, the variable's value is changed before the statement is evaluated.

Consider the following:

var myInt = 29; 
var yourInt = --myInt + 2; 
                     
console.log(myInt);         //outputs 28 
console.log(yourInt);  //outputs 30

The variable yourInt is initialized with the decremented value of myInt plus 2.

Because the decrement happens first, myInt is set to 28, and then 2 is added, resulting in 30.

The prefix increment and decrement have the same order of precedence and are therefore evaluated left to right. Consider this example:

var num1 = 2; 
var num2 = 20; 
var num3 = --num1 + num2;    //equals 21 
var num4 = num1 + num2;      //equals 21

num3 is equal to 21 because num1 is decremented to 1 before the addition occurs.

num4 contains 21, because the addition is done using the changed values.

The postfix increment and decrement use the same syntax but are placed after the variable instead of before it.

In postfix increment and decrement doesn't occur until after the containing statement has been evaluated.

var num1 = 2; 
var num2 = 20; 
var num3 = num1-- + num2;    //equals 22 
var num4 = num1 + num2;      //equals 21

The calculation for num3 uses the original value of num1 (2) to complete the addition, whereas num4 is using the decremented value (1).

All four of these operators work on any values, not just integers but strings, Booleans, floating-point values, and objects.

The increment and decrement operators follow these rules regarding values:

When used on a string that is a valid representation of a number, convert to a number and apply the change. The variable is changed from a string to a number.
When used on a string that is not a valid number, the variable's value is set to NaN. The variable is changed from a string to a number.
When used on a Boolean value that is false, convert to 0 and apply the change. The variable is changed from a Boolean to a number.
When used on a Boolean value that is true, convert to 1 and apply the change. The variable is changed from a Boolean to a number.
When used on a floating-point value, apply the change by adding or subtracting 1.
When used on an object, call its valueOf() method to get a value to work with. Apply the other rules. If the result is NaN, then call toString() and apply the other rules again. The variable is changed from an object to a number.

The following example demonstrates some of these rules:

var s1 = "1"; 
var s2 = "asdf"; 
var b = false; 
var f = 1.1; 
var o = {  
    valueOf: function() { 
        return -1; 
    } 
}; 
                               
s1++;   //value becomes numeric 2 
s2++;   //value becomes NaN 
b++;    //value becomes numeric 1 
f--;    //value becomes 0.10000000000000009 (due to floating-point inaccuracies) 
o--;    //value becomes numeric -2

Javascript - Increment/Decrement Operators

Introduction

Related Topic