Java Script Examples

Example 17

ex17.html: type convention

<script type="text/javascript">
<!--
/*  here is an example to clarify how the type
    convert to each other */
var a = "3";
var b = "7";
var c = a + b; // "37"
document.writeln("<p>" + c + "</p>");
a = 3;
b = "7";
c = a + b; // still "37"
document.writeln("<p>" + c + "</p>");
a = 3;
b = 7;
c = a + b; // this is 10
document.writeln("<p>" + c + "</p>");
a = "3";
b = "7";
c = a * b; // 21, this is the only reasonable intepretation
document.writeln("<p>" + c + "</p>");
// -->
</script>

ex18.html: parse integer and float. See also ex13.html.

<script type="text/javascript">
<!--
/*  here is an example to show you how to use
    parseInt and parseFloat */
a = "3.5";
b = "7.1";
c = a + b; // "3.57.1"
document.writeln("<p>" + c + "</p>");
d = parseFloat(a);
e = parseFloat(b);
f = d + e; // "10.6"
document.writeln("<p>" + f + "</p>");
// if the number is not in right format
h = "abc";
i = parseFloat(h);
if(isNaN(i)) {
  document.writeln("<p>Not a number</p>");
}
// -->
</script>

Example 19

ex19.html: == vs ===

<script type="text/javascript">
<!--
// difference between == and ===
a = "3";
b = 3;
if(a == b) { // equal
  document.writeln("<p>equal</p>");
} else {
  document.writeln("<p>not equal</p>");
}

if(a === b) { // not equal
  document.writeln("<p>equal</p>");
} else {
  document.writeln("<p>not equal</p>");
}
// -->
</script>

Example 20

ex20.html: functions. See also ex14.html and ex15.html.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>JavaScript Example 20</title>
<script type="text/javascript">
<!--
// an easy example of function
// all functions should be put in the head 
function squares(n) {
   for(i=1;i<=n;i++){ 
       document.writeln("<p>The square of "+i+" is "+ i*i + ".</p>");
  }
}
// -->
</script>
</head>
<body>
<script type="text/javascript">
<!--
// other part of the script still between body
a = prompt("Enter an integer: ");
// call function
squares(a);
// -->
</script>

</body>
</html>

Example 21

ex21.html: function again.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>JavaScript Example 21</title>
<script type="text/javascript">
<!--
// no return type is necessary
function max(x,y) {
  if(x < y) {
    return y;
  } else {
    return x;
  }
}
// -->
</script>
</head>
<body>
<script type="text/javascript">
document.writeln("<p>" + max(5,7) + "</p>");
document.writeln("<p>" + max(5.2,7.3) + "</p>");
</script>

</body>
</html>

Example 22

ex22.html: object.

<script type="text/javascript">
<!--
var student = new Object(); // create an object
// you can create any members at any time
student.ID = "102333444";
student.lastname = "Li";
student.firstname = "Charles";
student.yearOfBirth = 1984;
document.writeln("<p>student.ID is " + student.ID + ".</p>");
// another way to access studentID
document.writeln("<p>student.ID is " + student["ID"] + ".</p>");
// you can create new member
student.gpa = 4.0;
// go through all memebers
document.writeln("<ul>");
for(var name in student) {
   document.writeln("<li>" + name + " is " + student[name] + "</li>");
}
document.writeln("</ul>");
// delete
delete student.yearOfBirth;
document.writeln("<ul>");
for(var name in student) {
   document.writeln("<li>" + name + " is " + student[name] + "</li>");
}
document.writeln("</ul>");
// -->
</script>

Example 23

ex23.html: array

<!--
var array = new Array(5);
for(var i=0; i < 5; i++) {
  array[i] = i;
}
// array can grow
array[5] = 5;
array[6] = 10;
// notice that there are space between 6 and 10
array[10] = 200;
//0 1 2 3 4 5 10 undefined undefined undefined 200
// array.length is 10
// missing numbers are undefined
document.writeln("<p>");
for(var i=0; i < array.length; i++) {
   document.writeln(array[i] + "  ");
}
document.writeln("</p>");
array[7] = "Hi";
array[8] = true;
//0 1 2 3 4 5 10 Hi true undefined 200
document.writeln("<p>");
for(var i=0; i < array.length; i++) {
   document.writeln(array[i] + "  ");
}
document.writeln("</p>");
var array2 = [9,8,2,3, 5];
//9 8 2 3 5
document.writeln("<p>");
for(var i=0; i < array2.length; i++) {
   document.writeln(array2[i] + "  ");
}
document.writeln("</p>");
var array3 = [2,3, , , 5,1, "Hi", 3.2];
//2 3 undefined undefined 5 1 Hi 3.2
document.writeln("<p>");
for(var i=0; i < array3.length; i++) {
   document.writeln(array3[i] + "  ");
}
document.writeln("</p>");
// joint elements in an array
var array_string = array2.join(":");
//9:8:2:3:5
document.writeln("<p>" + array_string + "</p>");
array_string = array2.join("#");
//9#8#2#3#5
document.writeln("<p>" + array_string + "</p>");
// sorting
array2.sort();
array_string = array2.join(",");
//2,3,5,8,9
document.writeln("<p>" + array_string + "</p>");
// there are some other functions
// example, concat, slice, pop, push, reverse
// -->
</script>