VirtualMV/JavaScript/Calculations/Home

From WikiEducator
Jump to: navigation, search




Simple Math calculations

<html>
<head><title>JavaScript Math (increase/decrease variable)</title></head>
<body>
<script type="text/javascript">
  var intX;  intX = 2;  intX += 3; document.write( intX + ", "); //Adds 3 to intX  intX -= 2; document.write( intX ); //Subtracts 2 from intX</script>
</body>
</html>

Math object

The built-in Math object includes mathematical constants and functions. You do not need to create the Math object before using it.

functionMeaning (returns ..)
abs(x)the absolute value of x
ceil(x)the nearest integer greater than or equal to x
cos(x)the cosine of x
exp(x)the value of E raised to the power of x
floor(x)the nearest integer less than or equal to x
log(x)natural log of x
max(x,y)the number with the highest value of x and y
min(x,y)the number with the lowest value of x and y
pow(x,y)the value of the number x raised to the power of y
random()a random number between 0 and 1
round(x)x rounded to the nearest integer
sin(x)the sine of x
sqrt(x)the square root of x
tan(x)the tangent of x

Math example 1 (js6_01)

<html>
<head><title>JavaScript Math (js6_01)</title></head>
<body>
<script type="text/javascript">
  document.write("Maximum of 2 & 4 is " +Math.max(2,4)+ "<br />")  document.write("Mimimum of 2 & 4 is " +Math.min(2,4) + "<br />")  document.write("Rounded value of 7.25 is " +Math.round(7.25) + "<br />")  vntNum=Math.random()*10  document.write("Random number between 0 and 9 is " +Math.floor(vntNum) + "<br />")</script>
</body>
</html>

Note:Use refresh to see the random number change.

Example js6_01

Math example 2 Currency converter (js6_02)

<html>
<head>
<title>Currency Formatter</title>
<script type="text/javascript">
  function fnCurrencyconv(vntAmount) {
    vntAmount=parseFloat(vntAmount); // find number (parseFloat)
    vntAmount=vntAmount*100;            //convert to cents
    vntAmount=Math.floor(vntAmount); //chop of any decimals (floor)
    vntAmount=vntAmount/100;         //convert to dollars and cents
    document.frmConvert.txtCurrency.value=   "$" + vntAmount
  }
</script>
</head>
<body>
<form name="frmConvert">
  Enter a number with lots of decimals: 
  <input name="txtAmount" type="text" value="" onChange="fnCurrencyconv(this.value)" /><br />
  Currency value:
  <input name="txtCurrency" type="text" value="" />
</form>
</body>
</html>

Notes:

  • ParseFloat: Determines if the first character in the specified string is a number. If it is, it parses the string until it reaches the end of the number, and returns the number as a number, not as a string.
  • this.value is shorthand that says use "this" objects value
  • You need to click "off" the number for the currency to be shown.

Example js6_02


Currency conversion:

An easier solution was made available with JavaScript 1.5

$numin.toFixed(x) e.g.

  var vntNum = new Number(13.378);
  document.write (vntNum.toFixed(2)); // two decimal places

parseFloat

An issue that arises is when a number is expected in a textBox but the user does not enter one. In this case parseFloat will return Not a Number (NaN) and the arithmetic will not evaluate.

This can be fixed by adding an if statement straight after the number is converted, for example:

   vntNum = parseFloat(document.getElementById("txtNum").value);
   if (isNaN(vntNum)){vntNum = 0; }

This example shows the results of different JavaScript code Example js6_03


Activity: Simple calculator

  1. Create two text boxes (number 1 and Number 2) and four buttons +,*,*,/ plus an Answer text box
  2. When a user enters two numbers they can click the appropriate button and the total is placed in the total box
.. add your code in here ...

VmvIcon References.png References

virtualMV  |  Superquick wiki guide  |  Please give me some feedback

VirtualMV/JavaScript/Calculations/Home. (2017). In WikiEducator/VirtualMV wiki. Retrieved November 24, 2017, from http://wikieducator.org/VirtualMV/JavaScript/Calculations/Home    (zotero)