Programação II

Exercícios POO
Prof. Henrique Pequeno
Monitor: Dante
Exercício 1
Crie uma classe chamada Animal com um construtor que receba
um parâmetro name. A classe deve ter um método chamado
makeSound que imprime no console a mensagem "O animal faz
um som." Crie uma instância da classe Animal e imprima no
console o nome do animal, em seguida, chame o método
makeSound.
Resolução Exercício 1
// Definindo a classe Animal
class Animal {
constructor(name) {
this.name = name;
}

// Método para emitir som do animal

makeSound() {
console.log('O animal faz um som.');
}
}

// Instanciando um objeto da classe Animal

const animal = new Animal('Animal');
console.log(animal.name); // Saída: Animal
animal.makeSound(); // Saída: O animal faz um som.
Exercício 2
Crie uma classe chamada Rectangle (Retângulo) com os
seguintes atributos: width (largura) e height (altura). A classe
deve ter um método chamado draw que utiliza a função rect() do
p5.js para desenhar um retângulo na tela com as dimensões
especificadas pelos atributos width e height. Crie uma instância
da classe Rectangle com largura 100 e altura 50, e chame o
método draw para desenhar o retângulo na tela.
Resolução Exercício 2
class Rectangle {
constructor(largura, altura) {
this.largura = largura;
this.altura = altura;
}

draw() {
rect(0, 0, this.largura, this.altura);
}
}

function setup() {
createCanvas(400, 400);

const rectangle = new Rectangle(100, 50);

rectangle.draw();
}
Exercício 3
Crie uma classe chamada Circulo com o atributo raio. A classe
deve ter um método chamado desenha que utiliza a função
ellipse() do p5.js para desenhar um círculo na tela com o raio
especificado pelo atributo raio. Crie uma instância da classe
Circulo com raio 50 e chame o método desenha para desenhar o
círculo na tela.
Resolução Exercício 3
class Circulo {
constructor(raio) {
this.raio = raio;
}

desenha() {
ellipse(200, 200, this.raio * 2, this.raio * 2);
}
}

function setup() {
createCanvas(400, 400);

fill(255,0,100);
const circle = new Circulo(50);
circle.desenha();
}
Exercício 4
Crie uma classe chamada Person com um construtor que receba
dois parâmetros: name e age. A classe deve ter um método
chamado greet que imprime no console a mensagem "Olá, meu
nome é {name} e eu tenho {age} anos." Crie uma instância da
classe Person com o nome "João" e a idade "30". Imprima no
console o nome da pessoa e chame o método greet.
Resolução Exercício 4
// Definindo a classe Person
class Person {
constructor(name, age) {
this.name = name;
this.age = age;
}

// Método para cumprimentar a pessoa

greet() {
console.log(`Olá, meu nome é ${this.name} e eu tenho ${this.age} anos.`);
}
}

// Instanciando um objeto da classe Person

const person = new Person('João', 30);
console.log(person.name); // Saída: João
person.greet(); // Saída: Olá, meu nome é João e eu tenho 30 anos.
Exercício 5
Crie uma classe chamada Ball (Bola) com os atributos x, y, radius
e color. A classe deve ter um método chamado drawing que utiliza
a função ellipse() do p5.js para desenhar uma bola na tela com as
coordenadas (x, y), o raio radius e a cor color. Além disso, crie um
método chamado move que atualiza as coordenadas x e y da
bola para fazer com que ela se mova gradualmente pela tela.
Crie uma instância da classe Ball com coordenadas iniciais (200,
200), raio 30 e cor "red". Utilize o método drawing para desenhar
a bola na tela e o método move para fazê-la se mover
continuamente.
Resolução do Exercício 5
class Ball {
constructor(x, y, radius, color) {
this.x = x;
this.y = y;
this.radius = radius;
this.color = color;
}

draw() {
fill(this.color);
ellipse(this.x, this.y, this.radius * 2, this.radius * 2);
}

move() {
this.x += 1; // Incrementa a coordenada x para mover a bola horizontalmente
// Define o comportamento da bola ao chegar nas bordas da tela
if (this.x > width + this.radius) {
this.x = -this.radius;
}
Exercício 6
Crie uma classe chamada Particle (Partícula) com os atributos x, y,
speedX, speedY e color. A classe deve ter um método chamado drawing
que utiliza a função ellipse() do p5.js para desenhar uma partícula na
tela com as coordenadas (x, y), o raio fixo de 10 e a cor color. Além
disso, crie um método chamado move que atualiza as coordenadas x e
y da partícula com base nos atributos speedX e speedY, para fazer com
que ela se mova na direção especificada por esses atributos. Crie
uma instância da classe Particle com coordenadas iniciais (200, 200),
velocidade horizontal 2, velocidade vertical -1 e cor "blue". Utilize o
método drawing para desenhar a partícula na tela e o método move
para fazer com que ela se mova continuamente. Ao tocar as bordas,
a bola deve ser redirecionada, voltando a seu movimento interno
ao canvas.
 Resolução Exercício 6
class Particle {
constructor(x, y, speedX, speedY, color) {
this.x = x;
this.y = y;
this.speedX = speedX;
this.speedY = speedY;
this.color = color;
}

drawing() {
fill(this.color);
ellipse(this.x, this.y, 20, 20);
}

move() {
this.x += this.speedX;
this.y += this.speedY;

// Define o comportamento da partícula ao chegar nas bordas da tela

if (this.x > width || this.x < 0) {
this.speedX *= -1;
}
Exercício 6a: Utilizando o código anterior, instancie
mais duas partículas e faça com que, ao colidirem,
possam alterar suas direções
class Particle {
constructor(x, y, speedX, speedY, color) {
this.x = x;
this.y = y;
this.speedX = speedX;
this.speedY = speedY;
this.color = color;
this.radius = 10; // Adiciona um raio para cálculos de colisão
}
drawing() {
fill(this.color);
ellipse(this.x, this.y, 2 * this.radius, 2 * this.radius);
}
move() {
this.x += this.speedX;
this.y += this.speedY;
// Define o comportamento da partícula ao chegar nas bordas da tela
if (this.x > width - this.radius || this.x < this.radius) {
this.speedX *= -1;
}
if (this.y > height - this.radius || this.y < this.radius) {
this.speedY *= -1;
}
// Verifica colisão com outras partículas
for (let particle of particles) {
if (particle !== this) {
let distance = dist(this.x, this.y, particle.x, particle.y);
let minDistance = this.radius + particle.radius;
if (distance < minDistance) {
// As partículas se cruzaram, então inverte as direções
Exercício 7
Crie uma classe chamada Shape (Forma) com um método
abstrato getArea. Em seguida, crie duas subclasses: Circle
(Círculo) e Square (Quadrado). A classe Circle deve ter um
construtor que recebe o raio como parâmetro e implementar o
método getArea para calcular e retornar a área do círculo. A
classe Square deve ter um construtor que recebe o comprimento
do lado como parâmetro e implementar o método getArea para
calcular e retornar a área do quadrado. Crie uma instância da
classe Circle com raio 5 e imprima no console a área do círculo.
Em seguida, crie uma instância da classe Square com
comprimento do lado igual a 4 e imprima no console a área do
quadrado.
 Resolução Exercício 7
// Definindo a classe Shape
class Shape {
getArea() {
throw new Error('Método abstrato - deve ser implementado pelas subclasses.');
}
}

// Subclasse Circle (Círculo)

class Circle extends Shape {
constructor(radius) {
super();
this.radius = radius;
}

// Implementação do método getArea para Circle

getArea() {
return Math.PI * this.radius ** 2;
}
}

// Subclasse Square (Quadrado)

class Square extends Shape {
Exercício 8
• Crie uma classe chamada ProductUtils, que deverá conter um
método estático chamado calculateDiscount, que receberá o
preço de um produto e uma porcentagem de desconto. O
método deve retornar o valor do desconto aplicado ao preço do
produto.
Resolução Exercício 8
class ProductUtils {
static calculateDiscount(price, discountPercentage) {
const discount = (price * discountPercentage) / 100;
return discount;
}
}

const price = 100;

const discountPercentage = 20;
const discount = ProductUtils.calculateDiscount(price, discountPercentage);
console.log("O desconto aplicado é de R$ " + discount.toFixed(2));
Exercício 9
Crie uma classe chamada Particle (Partícula) com os atributos x, y, speedX, speedY, color e
radius(valor aleatório). A classe deve ter um método chamado drawing que utiliza a função
ellipse() do p5.js para desenhar uma partícula na tela com as coordenadas (x, y), um raio
aleatório entre 5 e 15 e a cor color.
Além disso, crie um método chamado move que atualiza as coordenadas x e y da partícula
com base nos atributos speedX e speedY, para fazer com que ela se mova na direção
especificada por esses atributos.
Em seguida, crie uma classe chamada ParticleSystem (Sistema de Partículas) com o atributo
particles(array) e os métodos addParticle, drawing e move.
O método addParticle deve criar uma nova instância da classe Particle e adicioná-la ao array
particles. O método drawing deve chamar o método drawing de cada partícula do array
particles.
O método move deve chamar o método move de cada partícula do array particles. Crie uma
instância da classe ParticleSystem na função setup() e na função draw() utilize os métodos
addParticle, drawing e move para criar e mover continuamente as partículas na tela.
Resolução do Exercício 9
class Particle {
constructor(x, y, speedX, speedY, color) {
this.x = x;
this.y = y;
this.speedX = speedX;
this.speedY = speedY;
this.color = color;
this.radius = random(5, 15);
}
drawing() {
fill(this.color);
ellipse(this.x, this.y, this.radius * 2, this.radius * 2);
}
move() {
this.x += this.speedX;
this.y += this.speedY;
// Define o comportamento da partícula ao chegar nas bordas da tela
if (this.x > width + this.radius || this.x < -this.radius) {
this.x = random(width);
this.y = random(height);
}
if (this.y > height + this.radius || this.y < -this.radius) {
Exercício 10
Crie uma classe chamada SnakeGame que implementa o jogo clássico da cobrinha
(Snake).
A classe deve ter os atributos width (largura do campo de jogo), height (altura do
campo de jogo), snake (uma instância da classe Snake), food (uma instância da
classe Food) e score (pontuação do jogador).
A classe deve ter os métodos setup (inicializa o jogo), draw (desenha o jogo) e
handleKeyPressed (gerencia as teclas pressionadas pelo jogador).
A classe Snake deve ter os atributos segments (um array de segmentos da cobra) e
direction (a direção atual da cobra).
A classe Food deve ter os atributos x e y (as coordenadas da comida no campo de
jogo).
A cada atualização do jogo (no método draw), verifique se a cobra colidiu com a
comida. Se sim, aumente a pontuação, mova a comida para uma nova posição
aleatória e adicione um segmento à cobra.
Também verifique se a cobra colidiu com as bordas do campo de jogo ou consigo
mesma. Em caso de colisão, reinicie o jogo. Utilize as funções rect() e ellipse() do
p5.js para desenhar a cobra e a comida na tela.
 Resolução Exercício 10
class Snake {
constructor() {
this.segments = [
{ x: 0, y: 0 },
{ x: 20, y: 0 },
{ x: 40, y: 0 }
];
this.direction = 'right';
}
move() {
const head = { ...this.segments[this.segments.length - 1] };
if (this.direction === 'right') {
head.x += 20;
} else if (this.direction === 'left') {
head.x -= 20;
} else if (this.direction === 'up') {
head.y -= 20;
} else if (this.direction === 'down') {
head.y += 20;