Skip to the content.

Classes and Methods Popcorn Hacks

Finished Classes Popcorn Hacks!

JavaScript Classes and Methods - Interactive Popcorns

In this notebook, you will learn about classes and methods in JavaScript. During the lesson, use these to enhance your understanding of clases and methods ###

  • Objectivs: Do something - Change Later
  • How:

Exercise 1: Create a Rectangle (aka a fridge) _________________________ Exercise 2: Change Dimensions Use the Rectangle to: Part a.) Create a rectangle with a width of 20 and height of 40. Part b.) Change the dimensions to make the area 200 units². _________________________ Exercise 3: Experiment with Areas a.) Find all pairs of dimensions that give an area of 48 units². _________________________ Exercise 4: Rectangle Class (Missing Methods) class Rectangle { constructor(width, height) { this.width = width; this.height = height; } // **Code missing**: Add method to calculate the perimeter of the rectangle getPerimeter() { // Add logic here to return the perimeter } } const rect = new Rectangle(10, 5); console.log(rect.getPerimeter()); // Output should be 30 _________________________ Exercise 5: Square Class (Missing Method) class Square { constructor(sideLength) { this.sideLength = sideLength; } // Code missing: Add method to calculate the diagonal of the square getDiagonal() { // Add logic here to calculate and return the diagonal } } const square = new Square(5); console.log(square.getDiagonal()); // Output should be 7.07 (sideLength * √2) ___________________________

%%js

class Rectangle{
    constructor(width, height){
        this.width = width;
        this.height = height;
    }
    calcArea(){
        return this.width * this.height;
    }
    getPerimeter(){
        return (this.width + this.height) * 2;
    }
}

const rectangle = new Rectangle(20, 40);
rectangle.height = 10;
console.log(rectangle.calcArea());

const fortyEight1 = new Rectangle(1, 48);
const fortyEight2 = new Rectangle(2, 24);
const fortyEight3 = new Rectangle(3, 16);
const fortyEight4 = new Rectangle(4, 12);
const fortyEight5 = new Rectangle(6, 8);

const rect = new Rectangle(5, 10);
console.log(rect.getPerimeter());

class Square{
    constructor(sideLength){
        this.sideLength = sideLength;
    }
    getDiagonal(){
        return (this.sideLength*(Math.sqrt(2)));
    }
}

const square = new Square(5);
console.log(square.getDiagonal());
<IPython.core.display.Javascript object>