JavaScript Unary Operators Explained
Summary: in this tutorial, you will learn how to use JavaScript unary operators that take a single operand and performs an operation.
Introduction to the JavaScript unary operators
Unary operators work on one value. The following table shows the unary operators and their meanings:
Unary Operators | Name | Meaning |
---|---|---|
+x | Unary Plus | Convert a value into a number |
-x | Unary Minus | Convert a value into a number and negate it |
++x | Increment Operator (Prefix) | Add one to the value |
–x | Decrement Operator (Prefix) | Subtract one from the value |
x++ | Increment Operator (Postfix) | Add one to the value |
x– | Decrement Operator (Postfix) | Subtract one from the value |
Unary plus (+)
The unary plus operator is a simple plus sign (+
). If you place the unary plus before a numeric value, it does nothing. For example
let x = 10;
let y = +x;console.log(y); // 10
Code language: JavaScript (javascript)
When you apply the unary plus operator to a non-numeric value, it performs a number conversion using the Number()
function wit the rules in the following table:
Value | Result |
---|---|
boolean | false to 0 , true to 1 |
string | Convert the string value based on a set of specific rules |
object | Call the valueOf() and/or toString() method to get the value to convert into a number |
For example, the following uses the unary plus operator to convert the string '10'
to the number 10
:
let s = '10';
console.log(+s); // 10
Code language: JavaScript (javascript)
The following example uses the unary plus operator (+
) converts a boolean value into a number, false
to 0
and true
to 1
.
let f = false,
t = true;console.log(+f); // 0
console.log(+t); // 1
Code language: JavaScript (javascript)
Output:
0
1
Suppose you have a product
object with the toString()
method as follows:
let person = {
name: 'John',
toString: function () {
return '25';
},
};console.log(+person);
Code language: JavaScript (javascript)
Output:
25
In this example, we apply the unary plus operator (+
) on the person
object that has the toString()
method, JavaScript engine calls toString()
method to get the value ('25'
) and convert it into a number.
The following adds the valueOf()
method to the person
object:
let person = {
name: 'John',
toString: function () {
return '25';
},
valueOf: function () {
return '30';
},
};console.log(+person);
Code language: JavaScript (javascript)
Output:
30
In this example, the person
object has the valueOf()
method, the JavaScript engine calls it instead of the toString()
method to get the value to convert.
Unary minus (-)
The unary minus operator is a single minus sign (-
). If you apply the unary minus operator to a number, it negates the number. For example:
let x = 10;
let y = -x;console.log(y); // -10
Code language: JavaScript (javascript)
If you apply the unary minus operator to a non-numeric value, it converts the value into a number using the same rules as the unary plus operator and then negates the value.
Increment / Decrement operators
The increment operator has two plus signs (++
) while the decrement operator has two minus signs (--
).
Both increment and decrement operators have two versions: prefix and postfix. And you place the prefix and postfix versions of the increment or decrement operators before and after the variable to which they apply.
The following example uses the prefix increment operator to add one to a variable:
let age = 25;
++age;console.log(age); // 26
Code language: JavaScript (javascript)
It’s equivalent to the following:
let age = 25;
age = age + 1;
console.log(age); // 26
Code language: JavaScript (javascript)
The following example uses the prefix decrement operator to subtract one from a variable:
let weight = 90;
--weight;console.log(weight); // 89
Code language: JavaScript (javascript)
It is equivalent to the following:
let weight = 90;
weight = weight - 1;console.log(weight); // 89
Code language: JavaScript (javascript)
When you apply the prefix increment or decrement, JavaScript changes the variable before evaluating the statement. For example:
let weight = 90;
weight = ++weight + 5;console.log(weight); // 96
Code language: JavaScript (javascript)
In this example:
- First, increase the weight on the right-hand side so ++weight is 91
- Second, add five to the ++weight that returns 96
- Third, assign the result to the weight on the left-hand side.
Likewise, the following example uses a prefix decrement operator:
let weight = 90;
weight = --weight + 5;console.log(weight); // 94
Code language: JavaScript (javascript)
In this example:
- First, subtract one from the weight, –weight returns 89
- Second, add five to the –weight that returns 94
- Third, assign the result to the weight on the left-hand side.
The postfix increment or decrement operator changes the value after the statement is evaluated. For example:
let weight = 90;
let newWeight = weight++ + 5;console.log(newWeight); // 95
console.log(weight); // 91
Code language: JavaScript (javascript)
How it works.
- First, add five to weight (90) and assign the result to the new weight (95)
- Second, add one to the weight variable after the second statement completes, the weight becomes 91.
- Third, output both newWeight and weight to the console.
When applying the increment/decrement operator to a non-numeric value, it performs the following steps :
- First, convert the value into a number using the same rules as the unary plus (+) operator.
- Then, add one to or subtract one from the value.
Summary
- Unary operators work on one value.
- Unary plus (
+
) or minus (-
) converts a non-numeric value into a number. The unary minus negates the value after the conversion. - The prefix increment operator adds one to a value. The value is changed before the statement is evaluated.
- The postfix increment operator adds one to a value. The value is changed after the statement is evaluated.
- The prefix decrement operator subtracts one from a value. The value is changed before the statement is evaluated.
- The postfix decrement operator subtracts one from a value. The value is changed after the statement is evaluated.