Lesson Plan

IMOS Home Student Center TallTech Home
 

March 9, 2000

Details

Title

Work with arrays, program loops, and conditional statements

Time Allotment

6 hrs

Reading / References

Tutorial 7 - Programming with JavaScript  - New Perspectives Manual (NP)

Objectives (Morning)

Objectives (Afternoon)

Coursework / Lab Work (Morning)

Coursework / Lab Work (Afternoon)

Homework

For Marks

Assignment #: JS01
Assignment: JavaScript Language Syntax
Due: March 15/2000
Marks: 10 marks

Complete case problems #1 & #3 from pp 7.44 - 7.49

Demo (Morning)

Exercises (Morning)

EXERCISE 1: UPDATED WEIGHT CONVERTER

Create a weight converter as from last class. This converter should be able to handle conversions either direction. A variable should be passed as the parameter that will allow the decision of which way to convert. Use a string variable as the parameter: Direction = "K" indicates conversion from Kilos to Lbs, Direction = "L" indicates conversion from Lbs to Kilos.

Use the same tests from last class to test your new function.

EXERCISE 2: RECORD RAINFALL

The average high and average low rainfall for July is 24mm and 11mm respectively. Write a program that allows the user to enter the rainfall for July. The program then determines if the rainfall was within the average rainfall range.

Define three variables:

    Var RainFall
    Var MaxRain = 24
    Var MinRain = 11

Assign a value to RainFall to a number of your choice.

Test the value of rainfall against the minimum and maximum rainfall. There is actually two tests to make: is RainFall greater than or equal to min? And is Rainfall less than or equal to Max? Here is how we would form this complex logical expression:

    RainFall>=MinRain && RainFall<=MaxRain

Write the conditional statements that will display either "The amount of rainfall is within normal" or "The amount of rainfall is not within normal" based on the numbers.

EXERCISE 3: ENHANCED DATE DISPLAY

Revise the date display function created last class so it will display the date in the following format:

                Today is Month Day, Year

The "Month" should be the actual name of the month.

Use nested if statements similar to:

                if(NumMonth == 1)
   
         {
   
             StringMonth = "January";
   
         }
   
         else
   
         {
        if (NumMonth == 2)
   
             {
   
                 StringMonth = "February";
   
             }
   
             else
   
             {
   
                 // continue with rest of months.

Solutions

EXERCISE 1: UPDATED WEIGHT CONVERTER

<HTML>
<HEAD>
 
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from older browsers
      function ConvertWeight(amount, units)
      {
            if(units == "K")
            {
                  //kilos to pounds
                  var lb = amount * 2.2;
                  return lb;
            }
            else
            {
                  //pounds to kilos
                  var kg = amount / 2.2;
                  return kg;
            }
      }
 
// End Hide -->
</SCRIPT>  
</HEAD>
<BODY>
 
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from older browsers
      var kgs = 45;
      var pounds = ConvertWeight(kgs, "K");
      document.write(kgs + " kilograms = " + pounds + " pounds.<BR>");
 
      pounds = 230;
      kgs = ConvertWeight(pounds, "L");
      document.write(pounds + " pounds = " + kgs + " kilograms.<BR>");
 
// End Hide -->
</SCRIPT>
 
</BODY>
</HTML>

EXERCISE 2: RECORD RAINFALL

<HTML>
<HEAD>
</HEAD>
<BODY>
 
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from older browsers
       var RainFall;
       var MaxRain = 24
       var MinRain = 11
 
       RainFall = 15;
 
       if((RainFall >= MinRain)&&(RainFall <= MaxRain))
       {
              document.write("The amount of rainfall is within normal");
       }
       else
       {
              document.write("The amount of rainfall is not within normal");
       }
// End Hide -->
</SCRIPT>
 
</BODY>
</HTML>

EXERCISE 3: ENHANCED DATE DISPLAY

<HTML>
<HEAD>
 
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from older browsers
       function DisplayDate(date)
       {
              var NumMonth = date.getMonth() + 1;
              var Day = date.getDate();
              var Year = date.getYear();
 
              if (NumMonth == 1)
              {
                     StringMonth = "January";
              }
              else if (NumMonth == 2)
              {
                     StringMonth = "February";
              }
              else if (NumMonth == 3)
              {
                     StringMonth = "March";
              }
              else if (NumMonth == 4)
              {
                     StringMonth = "April";
              }
              else if (NumMonth == 5)
              {
                     StringMonth = "May";
              }
              else if (NumMonth == 6)
              {
                     StringMonth = "June";
              }
              else if (NumMonth == 7)
              {
                     StringMonth = "July";
              }
              else if (NumMonth == 8)
              {
                     StringMonth = "August";
              }
              else if (NumMonth == 9)
              {
                     StringMonth = "September";
              }
              else if (NumMonth == 10)
              {
                     StringMonth = "October";
              }
              else if (NumMonth == 11)
              {
                     StringMonth = "November";
              }
              else
              {
                     StringMonth = "December";
              }
             
              document.write(StringMonth + " " + Day + ", " + Year + "<BR>");
       }
// End Hide -->
</SCRIPT>
</HEAD>
<BODY>
 
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from older browsers
       var Today = new Date();
       var Christmas = new Date("December, 25, 1999");
      
       DisplayDate(Today);
       DisplayDate(Christmas);
// End Hide -->
</SCRIPT>
</BODY>
</HTML>

Exercises (Afternoon)

EXERCISE 1: BALANCE CALCULATOR

Create a script that calculates the compounded monthly interest on a balance for an entire year. You should define variables for the initial balance and the annual interest rate. Set the variables to 1000 and 12 respectively.

You will need to apply a loop that loops 12 times in order to solve this problem. You will want to create an accumulator variable (name it CurrentBal) to calculate the accrued monthly balance.

*Note that the interest rate is for the whole year. You will want to divide it by 12 and then divide by 100 to make it a percentage.

Each iteration of the loop should perform the calculation, then display the results. After the loop has occurred 12 times, the total should be displayed. Your script should have the following output: 

Initial balance: 1000
Interest rate: 12
Month Balance
    1010
    1020.1
    1030.301
    1040.60401
    1051.0100501
    1061.5201506009998
    1072.1353521070098
    1082.85670562808
    1093.6852726843606
10     1104.6221254112042
11     1115.6683466653162
12     1126.8250301319694
Final balance is: 1126.8250301319694

EXERCISE 2: ARRAYS

An array of integers contains both positive and negative numbers. Assume that the negative numbers are undesirable, and we want to get rid of them. Form a NEW array by copying only the positive integers from the original array.

We define and initialize our array of mixed integers:

var Nums = new Array(5,-7,2,9,-22,-57,12,15,83,-45,22,67,-44);

We assign a variable that keeps track of the number of items in the array:

            var Counter = 13;

Finally we define our new array that will contain the positive integers. We also need a counter that will hold the next available slot in the new array:

     var PosNums = new Array();
   
     var PosNumsIndex = 0;

Our Strategy for copying the positive numbers from Nums to PosNums is to sequentially pass through the array Nums, and each time we arrive at a positive number, copy it to the next available slot in PosNums, then increment the PosNumsIndex: 

     for( NumsIndex=0; NumsIndex<Counter; NumsIndex++)
   
         if(Nums[NumsIndex]>=0)
        PosNums[PosNumsIndex++]=Nums[NumsIndex]; 

Write the script based on the above description. Once the new array has been formed, the script should display all elements of the new array.

Solutions

EXERCISE 1: BALANCE CALCULATOR

<HTML>
<HEAD>
</HEAD>
<BODY>
 
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from older browsers
       var InitBal = 1000;
       var IntRate = 12;
 
       document.write("Initial balance: " + InitBal + "<BR>");
       document.write("Interest rate: " + IntRate + "<BR>");
       document.write("Month&nbsp;&nbsp;&nbsp;&nbsp;Balance<BR>");
 
       var AccumBal = InitBal;
 
       for(i=1; i<=12; i++)
       {
              AccumBal = AccumBal + (AccumBal * (IntRate/12/100) );
              document.write(i);
              document.write("&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;");
              document.write(AccumBal + "<BR>");
       }
 
       document.write("Final balance is: " + AccumBal);                 
      
// End Hide -->
</SCRIPT>
 
</BODY>
</HTML>

EXERCISE 2: ARRAYS

<HTML>
<HEAD>
</HEAD>
<BODY>
 
<SCRIPT LANGUAGE="JavaScript">
<!-- Hide from older browsers
       var Nums = new Array(5,-7,2,9,-22,-57,12,15,83,-45,22,67,-44);
       var Counter = 13;
 
       var PosNums = new Array();
       var PosNumsIndex = 0;
 
       for( NumsIndex=0; NumsIndex<Counter; NumsIndex++)
       {
              if (Nums[NumsIndex] >= 0)
              {
                     PosNums[PosNumsIndex++]=Nums[NumsIndex];
              }
       }
 
       for( NumsIndex=0; NumsIndex<PosNumsIndex; NumsIndex++)
       {
              document.write(PosNums[NumsIndex] + "<BR>");
       }
      
// End Hide -->
</SCRIPT>

</BODY>
</HTML>