Penguins - Data Abstraction Homework

Penguins JS Lessons

Download Homework
Submission Google Form for Homework

Data Abstraction Homework

In order to learn this subject of programming well, you have to practice:

Popcorn hack 1: Data Abstraction with functions

Popcorn hack 2: Data abstraction with classes

Final Task: Building a player system using classes and functions

---

Popcorn Hack 1 (Progress Check)

Data abstraction with functions:

Part 1: Edit the Account() function to print out the username and password to the console using console.log().

Part 2: Edit the ChangeUsername() function to accept a newUsername parameter, then set the username variable to the newUsername parameter.

Part 3: Edit the ChangePassword() function to accept a newPassword parameter, then set the password variable to the newPassword parameter.

Part 4: Make the Login() function check if the parameters _username and _password are equal to the username and password variables, then print out if the login succeeded or failed using console.log().

%%javascript

// put popcorn hack 1 code here:

let username = "Giuseppe";
let password = "giuseppe_very_awesome_password";

function Account()
{
	console.log(username);
	console.log(password);
}

function ChangeUsername(newUsername)
{
	username = newUsername;
}

function ChangePassword(newPassword)
{
	password = newPassword;
}

function Login(_username, _password)
{
	if (_username === username && _password === password)
	{
		console.log("Login successful");
		return true;
	}
	else
	{
		console.log("Login failed");
		return false;
	}
}

// run the stuff a few times (output is in console btw)
Account();
Login("Giuseppe", "giuseppe_very_awesome_password");
ChangeUsername("newUser123");
ChangePassword("newPasswd");
Account();
Login("Giuseppe", "giuseppe_very_awesome_password");
Login("newUser123", "newPasswd");

<IPython.core.display.Javascript object>

---

Popcorn Hack 2 (Progress Check)

Use the examples provided in the lesson if you’re stuck.

Part 1: Make a class named House

Part 2: Make a constructor for the House class with the parameters cost, age, and size

Part 3: Make an instance of the House class with the name myHouse and fill the parameters with any numbers you want.

Write your code down here:

%%javascript

// popcorn hack 2 code goes here:
class House {
  constructor(cost, age, size) {
    this.cost = cost;
    this.age = age;
    this.size = size;
  }
}

const myHouse = new House(250000, 10, 1800);
console.log(myHouse.cost);
console.log(myHouse.age);
console.log(myHouse.size);

<IPython.core.display.Javascript object>

---

Final task

Part 1: Create 2 variables in the constructor like this: this.variableName = something. These variables will be called: this.positionX, this.velocityX.

Part 2: Create 2 methods called MoveLeft() and MoveRight(),
inside MoveLeft() set ‘this.velocityX’ to -200.
inside MoveRight() set ‘this.velocityX’ to 200.

Part 3: Create a function called UpdatePosition(). Inside this function, add ‘this.velocityX’ to ‘this.positionX’

Part 4: Call each method (MoveLeft(), MoveRight(), UpdatePosition() ), on the player object.

%%html

<div id="hwoutput"></div>

<script>
(() => {
  const output = document.getElementById("hwoutput");
  function writeOutput(msg) {
    output.innerText += msg + "\n";
    console.log(msg);
  }

  class Player {
    // part 1
    constructor() {
      this.positionX = 0;
      this.velocityX = 0;
      writeOutput(`Initial positionX: ${this.positionX}, velocityX: ${this.velocityX}`);
    }

    // part 2
    MoveLeft() {
      this.velocityX = -200;
      writeOutput(`MoveLeft() called, velocityX set to ${this.velocityX}`);
    }

    MoveRight() {
      this.velocityX = 200;
      writeOutput(`MoveRight() called, velocityX set to ${this.velocityX}`);
    }

    // part  3
    UpdatePosition() {
      this.positionX += this.velocityX;
      writeOutput(`UpdatePosition() called, positionX updated to ${this.positionX}`);
    }
  }

  // part 4
  let player = new Player();

  player.MoveLeft();
  player.MoveRight();
  player.UpdatePosition();
})();
</script>

---

Grading

Popcorn Hack 1: Completion gives 0.2 points.

Popcorn Hack 2: Completion gives 0.3 points.

Final Task: Completion gives 0.5 points. Max of 0.02 extra points from extra work relevant to the subject or finishing assignment in a way that shows exceptional comprehension of the lesson.

Make sure to submit your homework deployed link onto the global homework submission google sheet

Submission Google Form for Homework