14.6 Homework Assignment

Objective:

Students will write a script that uses multiple functions to calculate the area and perimeter of different shapes (such as rectangles, circles, and triangles).


Task:

  1. Create an HTML file (e.g., shapes_calculations.html) and write JavaScript code that includes the following functions:

    • A function to calculate the area and perimeter of a rectangle.

    • A function to calculate the area and circumference of a circle.

    • A function to calculate the area and perimeter of a triangle.

  2. Steps:

    • Define a separate function for each shape.

    • Pass the required parameters (such as dimensions) into each function.

    • Return or print the calculated area and perimeter/circumference for each shape.


Example Code:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Shape Area and Perimeter Calculations</title>
</head>
<body>
  <h1>Check the Console for Shape Calculations</h1>

  <script>
    // Function to calculate the area and perimeter of a rectangle
    function rectangleArea(length, width) {
      return length * width;
    }

    function rectanglePerimeter(length, width) {
      return 2 * (length + width);
    }

    // Function to calculate the area and circumference of a circle
    function circleArea(radius) {
      return Math.PI * radius * radius;
    }

    function circleCircumference(radius) {
      return 2 * Math.PI * radius;
    }

    // Function to calculate the area and perimeter of a triangle
    function triangleArea(base, height) {
      return 0.5 * base * height;
    }

    function trianglePerimeter(side1, side2, side3) {
      return side1 + side2 + side3;
    }

    // Example Calculations
    let length = 10, width = 5, radius = 7, base = 6, height = 8, side1 = 5, side2 = 6, side3 = 7;

    // Rectangle
    console.log("Rectangle Area: " + rectangleArea(length, width));  // Outputs: Rectangle Area: 50
    console.log("Rectangle Perimeter: " + rectanglePerimeter(length, width));  // Outputs: Rectangle Perimeter: 30

    // Circle
    console.log("Circle Area: " + circleArea(radius).toFixed(2));  // Outputs: Circle Area: 153.94
    console.log("Circle Circumference: " + circleCircumference(radius).toFixed(2));  // Outputs: Circle Circumference: 43.98

    // Triangle
    console.log("Triangle Area: " + triangleArea(base, height));  // Outputs: Triangle Area: 24
    console.log("Triangle Perimeter: " + trianglePerimeter(side1, side2, side3));  // Outputs: Triangle Perimeter: 18
  </script>
</body>
</html>

Instructions:

  • Step 1: Write the functions to calculate the area and perimeter/circumference for each shape (rectangle, circle, triangle).

  • Step 2: Use the functions to calculate the area and perimeter of shapes with sample values.

  • Step 3: Print the results using console.log().


Challenge:

  • Modify the script to handle different input values dynamically (e.g., prompt the user to input the dimensions of the shapes).

    Example:

    let length = prompt("Enter the length of the rectangle:");
    let width = prompt("Enter the width of the rectangle:");
    console.log("Rectangle Area: " + rectangleArea(length, width));
    console.log("Rectangle Perimeter: " + rectanglePerimeter(length, width));

Homework Submission:

  • Save your HTML file and submit it to the instructor.

  • Ensure the script correctly calculates and displays the area and perimeter/circumference of the shapes.


Expected Outcome:

Students will:

  • Practice creating and using multiple functions in one script.

  • Understand how to pass different parameters to functions and return calculated values.

  • Gain experience calculating geometric properties of shapes programmatically.

Last updated