## DEV Community is a community of 861,926 amazing developers

We're a place where coders share, stay up-to-date and grow their careers. # What you should know about Unary Operators in JavaScript

Hello World, in high school, we learnt the basic mathematical operators, addition `+`, multiplication `*` , substraction `-` and division `/`.
JavaScript also utilizes these operators to solve programming problems.

In this post, we take a look at the unary operator in JavaScript.

## Understanding basic terms

Before we dive further, let's understand some common terms

• `Operation`: An operation is a calculation of one or more values, called `operands` resulting in an output.
• `Operators`: These are signs or symbols that connects to the `operand`
• `Operand`: Operand is what the `operators` are applied to.

For instance in the `operation` 2 `+` 3, there are two operands, the left operand which is `2` , and the right operand which is `3`. The `+` sign in the middle then becomes the `operator`.
The `operator` will be applied on the `operand` to give the desired output.

There are several types of operators in Javascript

• Assignment operators
• Comparison operators
• Unary operators
• Logical operators
• String operators
• Ternary operators etc.

We focus on `Unary` Operators in this article.

### What is Unary Operator

An operator is said to be unary if it has a single `operand`.

The `unary` operator can either be before or after the `operand`.

JavaScript supports numerous unary operators, the below are some of the operators and their uses.

#### Unary operators and their uses.

• Unary plus (`+`): It converts the operand into a numeric value
• Unary minus(`-`): It converts the operand into a numeric value and negates the number afterwards.
• Prefix / postfix increment(`++`): The increment operator add a value of 1 to its operand and returns the incremented value
• Prefix / postfix decrement(`--`): The decrement operator substracts a value of 1 from its operand and returns the decremented value
• `typeof`: It returns `string` which gives you the data type of the operand.
• Logical NOT (`!`): Converts the operand to a boolean value and then negates it.

We will go deeper into the Logical NOT (`!`) in my next article, for now, let's see the implementation of the above operators.

### How to use the Unary plus (+) operator

The unary plus `+` operator helps us convert something into a numeric value. It can covert

• all string representation of numbers to their actual numeric values
• boolean values (`true` and `false`) to numeric values
• `null` to numeric values.

#### Syntax

The syntax for the unary operator is

``````operator operand
``````

For instance `+`100;

#### Converting string representation of numbers to numeric values

When we have a `string` value, for instance `'10'`, we can change it to a `numeric` value using the unary `+` operator.

Meaning, instead of having the `data type` to be a `string`, we can change it type to be a `number`.

Let's see the example below :

``````let x = '10';
console.log('the value of x is :', x );
console.log('the type of x is : ', typeof x);
/*converting the data type to number using unary plus */
x = +x;
/*checking the value and data type */
console.log('the value of x is : ', x);
console.log('the type of x is : ', typeof x);

``````

The output will be

``````the value of x is : 10
the type of x is :  string
the value of x is :  10
the type of x is :  number
``````

Let's investigate what is happening above.

Initially, the data type of `x` was a `string`, we then used the unary plus operator `+` to change the type to a `number`.
Now, instead of working with a string value of `x` (Eg, `'10'`), we have converted it to the `numeric` value (`10`).

### Applying the unary plus operator on boolean

When the unary plus `+` is applied on a `boolean`, it will convert it to the corresponding numeric value.
For instance :

• `false` will be converted to `0`
• `true` will be converted to `1`.

Let's see an example below

``````console.log('unary plus on true will result in ', +true);
console.log('unary plus on false will result in ', +false)

``````

The output will be

``````unary plus on true will result in  1
unary plus on false will result in  0
``````

Since the unary plus (`+`) works to convert a string value (eg. `'50'` to a numeric value, if it is operated on any string, it cannot convert it to numeric value hence will return `NaN`.

Let's see an example

``````let text = "this is a string";
console.log(+text);
``````

The output will be

``````NaN
``````

The `text` variable is a **string **of characters not a **number **hence it will return `NaN`.

### How to use the Unary minus operator

The unary minus converts an operand to a negative numeric value

Like the unary plus (`+`) the unary minus (`-`) converts the type to `number`. However, it will negate the value.

Let's use the same example above but use the unary minus `-` operator

``````let x = '10';
console.log('the value of x is :', x );
console.log('the type of x is : ', typeof x);
x = -x;
console.log('the value of x is : ', x);
console.log('the type of x is : ', typeof x);
``````

The output will be

``````the value of x is : 10
the type of x is :  string
the value of x is :  -10
the type of x is :  number
``````

### Using the increment operator

The increment operator (`++`) increases a value by 1 and returns the incremented value.

It can be used as either a **postfix **or **prefix **operator.

• The postfix increment operator means the operator comes after the operand. Eg `a++`. This will return the value first, before performing any increment.
• The prefix increment operator performs the increment and immediately returns the value.

#### Using the prefix increment operator

• With the prefix, the operator comes before the operand. Eg `++a`. This will increase the value then immediately return the increased value.

Let's take a look at some examples

``````let x = 80;
console.log('the value of x is', x);
let y = ++x;
console.log('the value of y is now ', y);
``````

The output of the above will be

``````the value of x is 80
the value of y is now  81

``````

#### Using the postfix increment operator.

With the postfix increment operator, the operator comes after the operand. Eg `a++`.
The postfix increment, will *return the initial value before incrementing. *

Let's take a look at the example below

``````let a = 3;
console.log('the value of a is ', a);
let b = a++;
console.log('the value of b is ', b);
console.log('the value of a is now ', a);

``````

The output of the above code will be

``````the value of a is  3
the value of b is  3
the value of a is now  4
``````

With the above output, eventhough we are incrementing the variable `a`, and assigning it to `b`, when we console.log `b` the output is still `3`.

• This is mainly because the postfix increment operator will **display the initial value and increase the value afterwards.

• We display `3`, then increases the value, later when we console.log `a` the value has increased to `4`.

We normally will see the postfix increment operator in action in a `for` loop.
Eg. in the code below

``````var colors=["red","blue","green"];
for (let i = 0; i < colors.length; i++) {
console.log(colors[i]);
}
``````

Because the postfix increment operator (`i++`) returns the value then later increase it by 1, we will display the initial item in the colors array using the index of 0, increase its index , then move to the next item.

### Using the decrement operator

The decrement operator (--) decrements (subtracts one from) its operand and returns a value.

It can also be used as a postfix or prefix operator.

• The prefix decrement operator will substract 1 from a value and then return it.

In the example below, we are using the prefix decrement to substract 1 from the `myAge` variable.

``````let myAge = 100;
myAge = --myAge;
console.log('decreasing the age by 1 results in', myAge)
``````

The output will be

``````decreasing the age by 1 results in 99
``````
• The postfix decrement operator returns the value before decreasing.

Let's apply the postfix decrement operator on the example below

``````let x = 10;
let y = x--;
console.log('the value of y is ', y)
console.log('the value of x is now ', x)
``````

The output will be

``````the value of y is  10
the value of x is now  9
``````

Because we are using the **postfix **decrement, we return the value of `x` first (10), assign it to `y` before decreasing it by 1.
Now if we consoloe.log(x) we get the value of `9`.

### Understanding the `typeof` operator.

We have already used the `typeof` in the examples above.

`typeof` is a unary operand which returns a string indicating that the data type of the operand.

#### Syntax

The syntax will be

``````typeof operand;
``````

Let's see some examples

``````let name ="Emmanuel"
let age = 30;
let isAlive = true;

console.log('data type of name is ', typeof name);
console.log('data type of age is ', typeof age);
console.log('data type of isAlive is ', typeof isAlive);
``````

The output will be

``````data type of name is  string
data type of age is  number
data type of isAlive is  boolean
``````

### Challenge

Let's take a little challenge to text our knowledge.

• What will be the final values of all the variables `a`, `b`, `c` and `d` after the code below ?
``````let a = 1, b = 1;

let c = ++a;
let d = b++;
``````

## Summary

In summary, we learnt that

• Unary operators work on one value
• The unary plus (`+`) or unary minus (`-`) will change a non numeric value to a number
• The increment operator (`++`) adds one to a value, whilst the decrement operator (`--`) substracts one from a value.
• The `typeof` operator helps you know the `data type` of the variable.