WebDevelopersNotes logo

home-icon Home / JavaScript / JavaScript Operators – String and Arithmetic Operators

JavaScript Operators – String and Arithmetic Operators

JavaScript Operators - String and Arithmetic Operators

We’ve already seen how values are assigned to variables. The equal to sign is an assignment operator.

var lucky_number = 7;

var url = "http://www.webdevelopersnotes.com";

Operators work on one or more values, called operands to yield a single result. An expression is a combination of operands and operators.

In the first example above, the assignment operator (=) sets the value of lucky_number variable to 7. The two values on the left and right hand side of the operator (lucky_number and 7) are, thus, the operands. The full JavaScript statement is an expression.

Arithmetic Operators

Arithmetic operators work on one or more numeric values yielding a single result.

  • + (Addition)
  • (Subtraction)
  • * (Multiplication)
  • / (Division)
  • % (Modulus)
  • ++ (Increment by 1)
  • (Decrement by 1)

Addition

     var a = 4 + 10;

In the expression above, the addition operator adds 4 and 10 to yield 14 and the assignment operator assigns this value to the variable a.

     var b = 3;
		(variable b is assigned a value of 3)

     b = 10 + 5 + 3 + 6;
		(b now equals 24)

Subtraction

     var c = 40 - 5;
		(c = 35)

Multiplication

     var d = 100 * 4;
		(d = 400)

Division

     var e = 100 / 4;
		(e = 25)

Using variables in expressions

Consider the following code

   var a = 4;
   var b = 6;
   var c = 10;
   var d = 3;

   var e = a + b + c;
		(e = 20)

   var f = b - c + a;
		(f = 0)

   var g = b / d + b;
		(g = 8)

What is Modulus?

The JavaScript Modulus Arithmetic operator returns the remainder left after division.

   var a = 70 % 16;

   (a is now equal to 6, since the remainder left
    after dividing 70 by 16 is 6)

   var b = 64 % 8;

   (b equals 0)

What are increment and decrement operators?

These arithmetic operators are used for increasing or decreasing the value of a variable by 1. They are used very frequently in JavaScript for loop and in other routine operations.

   var a = 5;
   a++;
		(a = 6)

   var b = 10;
   b--;
		(b = 9)

The function of the increment operator (and the decrement operator) can also be achieved by adding the digit 1 to the variable as:

   a = a + 1;

OR

   b = b - 1;

So why use a++ instead of a = a + 1?
The reason is that the JavaScript engine does the calculation for increment and decrement operators much faster. The difference in speed is not perceptible for small calculations and loops, however, with thousands of calculations, you’ll notice that the processing with the increment or decrement operator is much faster.

Strings and the String Operator

Just like numbers, variables can contain the string data type. Any text has to be stored as strings. Here are a few examples:

   var name = "Johnny Bravo";

   var url_address = 'http://www.webdevelopersnotes.com/';

   var music_piece = "Mozart's Symphony No. 40";

   var page_number = "15";

When assigning strings to variables, they have to be surrounded by quotes, single or double. If you forget this, JavaScript will throw an error. Note, even numerical digits can be stored as string data (look at the last example above). In such cases, the number acts as a string data type and NOT as a numeric data type.
The following will clear any doubts…

To concatenate two strings, you use the + string operator.

   var first_name = "Johnny";

   var last_name = "Bravo";

   var full_name = first_name + last_name;

Result:

   full_name = "JohnnyBravo";  (note, no space)

To introduce a space, we add a space character between the two variables.

   full_name = first_name + " " + last_name;

Now, 
   
   full_name = "Johnny Bravo";

Lastly, we look at how JavaScript handles digits as string data.

   var page = "15";

   var page2 = page + 1;

   var page3 = page + "2";   (note the quotes)

Result:

   page2 = "151";

   page3 = "152";

The reason is that the variable page stores digits as string data, the + sign, in this case behaves as the string concatenation operator and not as the arithmetic addition operator.

Sponsored Links

Your comments
Star icon IMPORTANT Have a question / problem? Click here to ask an expert.

Sponsored Links

Tips

How do I view a deleted web page?
Is there a way to view a deleted web page - one that is no longer available? Yes there is and the solution is quite simple. [more...]

Fact

The @ sign on the 33 Teletype keyboard which Ray Tomlinson used to invent the email system was located on alphabet "P" key. One had to use shift to type it. [more...]

We use cookies to give you the best possible website experience. By using WebDevelopersNotes.com, you agree to our Privacy Policy