JavaScript Unary Operators Example

JavaScript Unary Operators Example

In this tutorial, you will learn what are unary operators in javascript and how to use javascript unary operators.

JavaScript Unary Operators

  • What are unary operators?
  • Types of unary operators in js
    • Unary plus / minus
    • Increment / Decrements operators

What are unary operators?

A unary operator works on one operand.

Types of unary operators in js

There are two types of unary operators in javascript, the following operators are:

  • Unary plus / minus
  • Increment / Decrements operators

See the following unary operators in JavaScript are:

  • Unary plus (+)  – convert an operand into a number
  • Unary minus (-) – convert an operand into a number and negate the value after that.
  • prefix / postfix increments (++) – add one to its operand
  • prefix / postfix decrements (--) – subtract one from its operand.

Unary plus / minus

The unary plus operator is a simple plus sign + and the unary minus is the minus sign -. You can use a javascript unary plus or minus with js variables.

Consider the following examples:

let a = 15;
a = +a; // 15
a = -a; // -15

In the above example, The unary plus operator will not take any effect, whereas the unary minus negates the value.

If you can use unary plus or minus with non-numeric value, it will works the same conversion as the Number() function.

let str = '15';
console.log(+str); // 15

Here, str is a string. However, when we used the unary plus operator with it, it will convert string to a number.

The following example shows how the unary operator converts boolean values into numbers, false to 0 and true to 1.

let f = false,
    t = true;
console.log(+f); // 0
console.log(+t); // 1

Increment / Decrements operators

JavaScript borrows increment and decrement operators from the C language. Both of increment and decrement operators have two versions: prefix and postfix.

You put he prefix version of the increment or decrement operators before a variable and the postfix versions after the variable.

Consider the following example:

Add 1 to a variable by using the prefix increment operator:

let a = 20;
++a;
console.log(a); // 21

In this example, the prefix increment operator adds 1 to the value of a. As a result, the value of a is 9.

The work is the same as the following:

let a = 20;
dan = a + 1;
console.log(a); // 21

The prefix decrement operator subtracts 1 from a given value:

let a = 20;
--a;
console.log(a); // 19

In this example, the prefix decrement subtracts 1 from 9.

It’s necessary to note that, the variable value changed before the statement is executed by using prefix decrement.

See the following example:

let x = 10, 
    y = 20;
let z = --x + y;
console.log(z); // 29

T prefix decrement operator is evaluated first, the value of x is update to 9, and then 20 is added, resulting in 29.

The postfix versions of increment and decrement have the same forms: ++ and -- but are placed after a variable.

The only difference between the postfix and prefix is that JavaScript doesn’t evaluate them until the containing statement has been evaluated.

Here is an example:

let i = 10;
i--;

After the second statement, the value of i is 9.

It has the same work as:

let i = 10;
--i;

Now, we clear some difference, when you mix the postfix version with other operations:

let i = 10, j = 20;
let m = i-- + j;
console.log(m); // 30
console.log(i); // 9

i = 10;
let n = --i + j;
console.log(n); // 29
console.log(i); // 9

In this example, m uses the original value of i, which is 10 whereas n uses the decremented value of i which is 9.

Conclusion

In this tutorial, you have learned what is unary operators in js and how to use JavaScript unary operators.

AuthorAdmin

My name is Devendra Dode. I am a full-stack developer, entrepreneur, and owner of Tutsmake.com. I like writing tutorials and tips that can help other developers. I share tutorials of PHP, Javascript, JQuery, Laravel, Livewire, Codeigniter, Vue JS, Angular JS, React Js, WordPress, and Bootstrap from a starting stage. As well as demo example.

Leave a Reply

Your email address will not be published. Required fields are marked *