Chapter Eight
Performing Calculations


Using JavaScript for Mathematics

Every one of these built-in routines for doing math from JavaScript can be done without them!

So you're to be pardoned if you ask, "Well, why-in-the-hell learn them?"

The answer is simple -- they're way faster to script and use. Even if some of them don't work on every platform or with every browser version.

You'll find some straight string analysis substitute routines for some of the following Math. calls that will get you to the same place without the built-in routines. I call them "ugly code", because real programmers look at them and say, "Ugh! What's that?"

I often get the last laugh, though, because some of my ugly routines don't break on different platforms.

But you're the boss. You can take your choice as to which to use! Only other web wizards will ever know you used the ugly stuff, anyhow.

I've prepared a sample script that employs all of the calls in this group, which may be useful as a reference when you are needing one of these calculations for your own scripts.

<HTML><HEAD>
<TITLE>JS Mathematics Calls</TITLE>
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from JS-Impaired Browsers
var y=2;
var z=8;
function prtIt(){
 document.write("<CENTER><TABLE><BOR"
 +"DER=0 WIDTH=486><TR>"
 +"<TD VALIGN=TOP WIDTH=50%>"
 +"<P>Obtaining the absolute value:"
 +"<BR>y=-2;<BR>x=Math.abs(y);<BR>will"
 +" set<BR>x="+Math.abs(-2)+";"
 +"<P>Obtaining the ceiling value:"
 +"<BR>y=1.01;<BR>x=Math.ceil(y);<BR>will"
 +" set<BR>x="+Math.ceil(1.01)+";"
 +"<P>Obtaining the floor value:"
 +"<BR>y=1.999;<BR>x=Math.floor(y);<BR>"
 +"will set<BR>x="+Math.floor(1.999)+";"
 +"<P>Obtaining the rounding value:"
 +"<BR>y=20.355;<BR>x=Math.round(y);"
 +"<BR>will set<BR>x="
 +Math.round(20.355)+";"
 +"<P>Obtaining two decimal value using"
 +"<BR>rounding:"
 +"<BR>y=20.355;<BR>"
 +"x=Math.round(y*100)/100;<BR>will set"
 +"<BR>x="
 +(Math.round(20.355*100)/100)+";"
 +"<P>Obtaining the greater of two"
 +"<BR>numeric variables:"
 +"<BR>y=20;<BR>z=10;"
 +"<BR>x=Math.max(y,z);<BR>will set"
 +"<BR>x="+Math.max(20,10)+";"
 +"<P>Obtaining the lesser of two"
 +"<BR>numeric variables:"
 +"<BR>y=20;<BR>z=10;"
 +"<BR>x=Math.min(y,z);"
 +"<BR>will set<BR>x="+Math.min(20,10)+";"
 +"<P>Obtaining a base(y) to the powe"
 +"r(z):"
 +"<BR>y=2;<BR>z=8;<BR>"
 +"x=Math.pow(y,z);<BR>will set<BR>x="
 +Math.pow(y,z)+";"
 +"<P>Obtaining a pseudo-random numb"
 +"er<BR>between 0 and 1 (UNIX only):"
 +"<BR>x=Math.random();<BR>will set"
 +"<BR>x="+Math.random()+";")
 srand()
 document.write("<P>Obtaining a pseudo"
 +"-random number<BR>between 0 and 9"
 +" (all):<BR>function srand(){<BR> t=new"
 +" Date();<BR> r=t.getTime();"
 +"<BR> p=''+r;<BR> p=p.charAt(p.leng"
 +"th-4);<BR> x=p;<BR> }"
 +"<BR>will set r="+r+"<BR>and x="+x+";");
 srand1();
 document.write("<P>Obtaining a pseudo"
 +"-random number<BR>between 00 and"
 +" 99 (all):"
 +"<BR>function srand(){<BR> t=new"
 +" Date();<BR> r=t.getTime();"
 +"<BR> p=''+r;<BR> p=p.substring(p.leng"
 +"th-4,p.length-2);<BR> x=eval(p);<BR> }"
 +"<BR>will set r="+r+"<BR>and x="+x+";"
 +"<P>Obtaining the square root of two -"
 +" a constant:<BR>x=Math.SQRT2;<BR>"
 +"will set<BR>x="+Math.SQRT2+";"
 +"<P>Obtaining the square root of one-"
 +"half<BR>(the reciprocal of the square"
 +" root of two)<BR>- a constant:"
 +"<BR>x=Math.SQRT1_2;<BR>will set"
 +"<BR>x="+Math.SQRT1_2+";"
 +"<P>Obtaining the square root of a"
 +" variable:<BR>y=25;<BR>x=Math.sqrt"
 +"(y);<BR>will set<BR>x="
 +Math.sqrt(25)+";"
 +"<P>Obtaining the value of pi:"
 +"<BR>x=Math.PI;<BR>will set<BR>x="
 +Math.PI+";"
 +"<P>Obtaining the sine of an angle:"
 +"<BR>y=30;<BR>x=Math.sin(y);"
 +"<BR>will set<BR>x="+Math.sin(30)
 +";</TD><TD VALIGN=TOP WIDTH=50%>"
 +"<P>Obtaining the arc sine of an angle:"
 +"<BR>y=.1;<BR>x=Math.asin(y);"
 +"<BR>will set<BR>x="+Math.asin(.1)+";"
 +"<P>Obtaining the cosine of an angle:"
 +"<BR>y=30;<BR>x=Math.cos(y);"
 +"<BR>will set<BR>x="+Math.cos(30)+";"
 +"<P>Obtaining the arc cosine of an"
 +" angle:<BR>y=.1;<BR>x=Math.acos(y);"
 +"<BR>will set<BR>x="+Math.acos(.1)+";"
 +"<P>Obtaining the tangent of an angle:"
 +"<BR>y=30;<BR>x=Math.tan(y);"
 +"<BR>will set<BR>x="+Math.tan(30)+";"
 +"<P>Obtaining the arc tangent of an"
 +" angle:<BR>y=.1;<BR>x=Math.atan(y);"
 +"<BR>will set<BR>x="+Math.atan(.1)+";"
 +"<P>Obtaining Euler's constant to the"
 +" power of y:<BR>y=2;"
 +"<BR>x=Math.exp(y);<BR>will set<BR>x="
 +Math.exp(2)+";"
 +"<P>Obtaining the natural logarith (base"
 +" e) of y:<BR>y=2;<BR>x=Math.log(y);"
 +"<BR>will set<BR>x="+Math.log(2)+";"
 +"<P>Obtaining the natural logarith"
 +"<BR>(base e) of 2 (a constant):"
 +"<BR>x=Math.LN2;<BR>will set<BR>x="
 +Math.LN2+";"
 +"<P>Obtaining the natural logarithm"
 +"<BR>(base e) of 10 (a constant):"
 +"<BR>x=Math.LN10;<BR>will set<BR>x="
 +Math.LN10+";"
 +"<P>Obtaining Euler's constant"
 +"<BR>(the base of natural logarithms):"
 +"<BR>x=Math.E;<BR>will set<BR>x="
 +Math.E+";"
 +"<P>Obtaining the base 2 logarithm"
 +"<BR>of Euler's constant (a constant):"
 +"<BR>x=Math.LOG2E;<BR>will set<BR>x="
 +Math.LOG2E+";"
 +"<P>Obtaining the base 10 logarithm"
 +"<BR>of Euler's constant (a constant):"
 +"<BR>x=Math.LOG10E;<BR>will set"
 +"<BR>x="+Math.LOG10E+";"
 +"<P>Obtaining a floating point number"
 +"<BR>equivalent to a string:"
 +"<BR>str='-.12345';<BR>x=parseFloa"
 +"t(str)<BR>will set<BR>x="
 +parseFloat('-.12345')+";"
 +"<P>Obtaining a string in a different"
 +"<BR>base equivalent to a string:"
 +"<BR>str='11111111';<BR>y=2; \/\/ base"
 +"<BR>x=parseInt(str,y)<BR>will set"
 +"<BR>x="+parseInt("11111111",2)+";"
 +"<P>Obtaining a numeric equivalent to"
 +" a string:<BR>str='255';<BR>x=eval(str)"
 +"<BR>will set<BR>x="+eval('255')+";")
 valIt();
 document.write("<P>Obtaining a numer"
 +"ic equivalent to a string<BR>(for earlier"
 +" browsers) - This function:"
 +"<P>function valIt(){<BR> ns='0123"
 +"456789';<BR> anumber=0;"
 +"<BR> astring='12345';<BR> "
 +"for (var i=astring.length-1;i>-1;i--){"
 +"<BR>  pos=ns.indexOf(astr"
 +"ing.charAt(i));"
 +"<BR>  mlt=astring.length"
 +"-i-1;"
 +"<BR>  mlt=Math.pow(10,"
 +"(astring.length-i-1));"
 +"<BR>  anumber+=pos*mlt"
 +";<BR> }<P>will set<BR>anumber="
 +anumber+";</TD></TR></TABLE>");
 }
function valIt(){
 ns="0123456789";
 anumber=0;
 astring="12345"
 for (var i=astring.length-1;i>-1;i--){
  pos=ns.indexOf(astring.charAt(i));
  mlt=Math.pow(10,(astring.length-i-1));
  anumber+=pos*mlt;
  }
 }
function srand(){
 t=new Date();
 r=t.getTime();
 p=""+r;
 p=p.charAt(p.length-4);
 x=p;
 }
function srand1(){
 t=new Date();
 r=t.getTime();
 p=""+r;
 p=p.substring(p.length-4,p.length-2);
 x=eval(p);
 }
// End Hiding -->
</SCRIPT>
</HEAD>
<BODY BGCOLOR="white">
<CENTER>
<P><B>JavaScript Mathematics Calls</B>
<BR>Each of these calls is printed to screen from JavaScript
<P>
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from JavaScript-Impaired Browsers
prtIt();
// End Hiding -->
</SCRIPT>
</BODY>
</HTML>

Click Here for Math Script.

Numeric Analysis: Built-in Routines:

x=Math.abs(y);

Sets x equal to the absolute value of y, y being either a literal number or a variable you have set equal to a number.

y=-2;
x=Math.abs(y);

will set

x=2;

x=Math.ceil(y);

Sets x equal to the least integer -- a whole number -- greater than or equal to y.

Caution: This is not a rounding operator. As shown in the example, if y is set equal to 1.01, your numeric x would be set equal to 2.

y=1.01;
x=Math.ceil(y);

will set

x=2;

x=Math.floor(y);

Sets x equal to the greatest integer - whole number - less than or equal to y.

Caution: This is not a rounding operator. As shown in the example, if y is set equal to 1.999, x would be set equal to 1.

y=1.999;
x=Math.floor(y);

will set

x=1;

x=Math.round(y);

Sets x equal to the value of the literal or variable y rounded to the nearest integer - whole number.

Caution: Be careful. This is not enough for usual financial calculations. To obtain two decimal places rounded properly, for example, you will need to multiply x by 100 and divide the result by 100:

y=20.355;
x=Math.round(y);

will set

x=20;

But this format will get two decimal rounding

x=(Math.round(y*100))/100;

setting

x=20.36;

x=Math.max(y,z);

Sets x equal to the greater of y and z, with y and z being literal numbers or variables you have set equal to any two numbers.

y=20;
z=10;
x=Math.max(y,z);

will set

x=20;

x=Math.min(y,z);

Sets x equal to the lesser of y and z, with y and z being literal numbers or variables you have set equal to any two numbers.

y=20;
z=10;
x=Math.min(y,z);

will set

x=10;

x=Math.pow(y,z);

Sets x equal to the value of y to the power of z, with y and z being literal numbers or variables you have set equal to the base(y) and exponent (z) you wish evaluated.

y=2;
z=8
x=Math.pow(y,z);

will set

x=256;

x=Math.random();

Sets x equal to a pseudo-random number between 0 and 1.

x=Math.random();

will set

x=(a value >0&&<1);

Caution: Since this only works on UNIX servers, it is recommended that you use the following "ugly" routine script in its place:

function srand(){
 t=new Date();
 r=t.getTime();
 p="a"+r;
 p=p.charAt((p.length-4));
 x=p;
 }

This function will set x equal to a pseudo-random number between 0 and 9, and will work on all platforms.

x=Math.SQRT1_2;

Sets x equal to the square root of one-half, that is the reciprocal of the square root of two, approximately 0.707.

Since this is a constant, it is a "read only" call, meaning that you can't change it. You may be asking yourself right now, "Why don't I just define x as being equal to 0.707 in the first place?" And I would be forced to reply, "Why not, indeed?"

x=Math.SQRT2;

Sets x equal to the square root of 2, approximately 1.414.

Since this is a constant, it is a "read only" call, meaning that you can't change it. You may be asking yourself right now, "Why don't I just define x as being equal to 1.414 in the first place?" And I would be forced to reply, "Why not, indeed?"

x=Math.sqrt(y);

Sets x equal to the square root of y, with y being either a literal or variable you have set equal to a positive (non-negative) number.

If you flub up and use a negative value for y, you will find x is set equal to 0.

y=25;
x=Math.sqrt(y);

will set

x=5;

String-Numeric Conversions

x=parseFloat("variable");

Sets x equal to a floating point number equivalent to the string variable.

Caution: this will truncate if it encounters anything in your string besides numerals, plus, minus, decimal point or an exponent. If it finds a "foreign" character, x will be set equal only to the string occurring prior to the "foreign" character.

If the first character of variable is a "foreign" character, x will be set equal to 0 on Windows® machines and "NaN" on all other machines.

str='-.12345';
x=parseFloat(str);

will set

x=-.12345;

x=parseInt(variable,y);

Sets x equal to the literal string or variable you have set equal to a string in variable in the base specified by the literal number or variable you have set equal to a number in y.

"What's this good for?" you may be asking. Well, at an introductory level, not a heck of a lot.

If you are doing binary to base 10 conversions, this may be a very useful operator, however.

Or, if you are one of those folks who use octal or hex a lot. By the way, if you are, I can't tell you how filled with admiration I am!

In the event this is important to your programming, you'll find more info in the Netscape® authoring documentation available at http://www.netscape.com

str='11111111'; // binary
y=2; // base 2
x=parseInt(str,y);

will set

x=255;

x=eval(variable);

x is set equal to the numeric equivalent of the literal string variable or variable you have set equal to a string.

JavaScript is not yet adept at treating strings and numerics as would be appropriate given the syntax of the code. It is to be hoped this will be remedied in the future.

This means you must convert a string into a numeric before you can perform any math calculations with it.

Worse yet, eval(); isn't supported on all platforms with all browser versions. So you will be prudent to assume that this call is non-useful and substitute your own conversions from strings to numerics using a few extra lines of code.

One way of doing this:

function valIt(){
 ns="0123456789";
 anumber=0;
 astring="12345"
 for (var i=astring.length-1;i>-1;i--){
  pos=ns.indexOf(astring.charAt(i));
  mlt=Math.pow(10,(astring.length-i-1));
  anumber+=pos*mlt;
  }
 }
if (isNaN(variable){
 true result; // i.e. Not a Number
 }
 else{
  false result; // ie is a number
 }

This is a testing statement you can use only on Unix platforms to see if a parseInt(); or parseFloat(); call you have made was successful.

Fairly esoteric for the beginner, I wouldn't worry about it for now. Maybe you'll want to know more later, but I doubt it.

Truth be told, if you do your scripting carefully, this'll never come up. It is a crutch for bad programmers and for folks who groove on Unix. You aren't one of those, are you? Oops... Sorry! Forget I said anything!

Trigonometric Functions

The built-in operators in JavaScript for trigonometric functions are labelled intuitively.

x=Math.PI;

Sets x equal to pi, a nominal value of 3.14159. You may be asking yourself right now, "Why don't I just define x as being equal to 3.14159 in the first place?" And I would be forced to reply, "Why not, indeed?"

x=Math.sin(y);

Sets x equal to the sine of y, y being the size of an angle in radians, with x always being set equal to a value between -1 and 1.

x=Math.asin(y);

Sets x equal to the arc sine (in radians) of y, with y being a literal number or a variable name you have set equal to a number between -1 and 1.

x=Math.cos(y);

Sets x equal to the cosine of y, with y being the size of an angle in radians, with x always being set equal to a value between -1 and 1.

x=Math.acos(y);

Sets x equal to the arc cosine (in radians) of y, with y being a literal number or a variable name you have set equal to a number between -1 and 1.

x=Math.tan(y);

Sets x equal to the tangent of y, with y being the size of an angle in radians, with x always being set equal to a value between -1 and 1.

x=Math.atan(y);

Sets x equal to the arc tangent (in radians) of y, with y being a literal number or a variable name you have set equal to a number between -1 and 1.

Logarithmic Functions

x=Math.exp(y);

Sets x equal to ey, where e is Euler's constant (the base of the natural logarithms) and y is a literal number or a variable you have set equal to a number.

x=Math.log(y);

x is set equal to the natural logarithm (base e) of y, which may be a numeric literal or a variable you have set equal to a number.

Caution: You must use a positive (non-negative, non-zero) value for y. If y is out of range, i.e. 0 or less, you will get x set equal to this value:

x=-1.797693134862316e+308;

x=Math.LN2;

Sets x to the natural logarithm of two, approximately 0.693.

Since this is a constant, it is a "read only" call, meaning that you can't change it. You may be asking yourself right now, "Why don't I just define x as being equal to 0.693 in the first place?" And I would be forced to reply, "Why not, indeed?"

x=Math.LN10;

Sets x to the natural logarithm of 10, approximately 2.303.

Since this is a constant, it is a "read only" call, meaning that you can't change it. You may be asking yourself right now, "Why don't I just define x as being equal to 2.303 in the first place?" And I would be forced to reply, "Why not, indeed?"

x=Math.E;

Set x equal to Euler's constant and the base of natural logarithms, approximately 2.718.

Since this is a constant, it is a "read only" call, meaning that you can't change it. You may be asking yourself right now, "Why don't I just define x as being equal to 2.718 in the first place?" And I would be forced to reply, "Why not, indeed?"

x=Math.LOG2E;

Set x equal to the base 2 logarithm of Euler's constant, approximately 1.442.

Since this is a constant, it is a "read only" call, meaning that you can't change it. You may be asking yourself right now, "Why don't I just define x as being equal to 1.442 in the first place?" And I would be forced to reply, "Why not, indeed?"

x=Math.LOG10E;

Sets x equal to the base 10 logarithm of Euler's constant. It will return a value of approximately 0.434.

Since this is a constant, it is a "read only" call, meaning that you can't change it. You may be asking yourself right now, "Why don't I just define x as being equal to 0.434 in the first place?" And I would be forced to reply, "Why not, indeed?"



© Copyright 1997, John H. Keyes john.keyes@intellink.net