Skip to content

Commit 580f4a6

Browse files
kontroldevkontroldev
authored
Merge pull request mouredev#4837 from Chrisdev00/Chrisdev00-branch
#28 - python y javascript
2 parents a893342 + 477a110 commit 580f4a6

File tree

2 files changed

+563
-0
lines changed

2 files changed

+563
-0
lines changed

‎Roadmap/28 - SOLID LSP/javascript/Chrisdev00.js

+300
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,300 @@
1+
/*
2+
* EJERCICIO:
3+
* Explora el "Principio SOLID de Sustitución de Liskov (Liskov Substitution Principle, LSP)"
4+
* y crea un ejemplo simple donde se muestre su funcionamiento
5+
* de forma correcta e incorrecta.
6+
*
7+
* DIFICULTAD EXTRA (opcional):
8+
* Crea una jerarquía de vehículos. Todos ellos deben poder acelerar y frenar, así como
9+
* cumplir el LSP.
10+
* Instrucciones:
11+
* 1. Crea la clase Vehículo.
12+
* 2. Añade tres subclases de Vehículo.
13+
* 3. Implementa las operaciones "acelerar" y "frenar" como corresponda.
14+
* 4. Desarrolla un código que compruebe que se cumple el LSP.
15+
*/
16+
17+
// Forma incorrecta sin aplicar el principio LSP
18+
19+
class Content{
20+
render(){
21+
throw new Error("Method 'render' must be implemented.");
22+
}
23+
24+
getSummary(){
25+
throw new Error("Method 'summary' must be implemented.");
26+
}
27+
}
28+
29+
class Article extends Content{
30+
constructor(title, body){
31+
super();
32+
this.title = title;
33+
this.body = body
34+
}
35+
render(){
36+
return `${this.title}<p>${this.body}</p> `;
37+
}
38+
getSummary(){
39+
return this.body.substring(0, 100) + "...";
40+
}
41+
}
42+
43+
class Video extends Content{
44+
constructor(title,videoUrl){
45+
super();
46+
this.title = title;
47+
this.videoUrl = videoUrl
48+
}
49+
render(){
50+
return `${this.title}<video src='${this.videoUrl}' controls></video>`;
51+
}
52+
getSummary(){
53+
return `${this.title} (Video)`;
54+
}
55+
}
56+
57+
class ImageGallery extends Content{
58+
constructor(title, images){
59+
super();
60+
this.title = this.title;
61+
this.images = images;
62+
}
63+
render(){
64+
const imageTags = this.images.map(image => `<img src='${image}' />`).join('');
65+
return `${this.title}${imageTags}`;
66+
}
67+
getSummary(){
68+
return `${this.title} (${this.images.length} images)`;
69+
}
70+
}
71+
72+
function displayContent(content){
73+
if(content instanceof Article){
74+
console.log("Rendering Article:");
75+
console.log(content.render());
76+
console.log("Summary:");
77+
console.log(content.getSummary());
78+
} else if(content instanceof Video){
79+
console.log("Rendering Video:");
80+
console.log(content.render());
81+
console.log("Summary:");
82+
console.log(content.getSummary());
83+
} else if(content instanceof ImageGallery){
84+
console.log("Rendering Image Gallery:");
85+
console.log(content.render());
86+
console.log("Summary:");
87+
console.log(content.getSummary());
88+
} else {
89+
console.log("Unknown content type");
90+
}
91+
}
92+
93+
const article = new Article("My Article", "This is the body of my article.");
94+
const video = new Video("My Video", "http://example.com/video.mp4");
95+
const imageGallery = new ImageGallery("My Gallery", ["http://example.com/image1.jpg", "http://example.com/image2.jpg"]);
96+
97+
displayContent(article);
98+
displayContent(video);
99+
displayContent(imageGallery);
100+
101+
102+
// Forma correcta de aplicar el principio LSP
103+
104+
class Content {
105+
render() {
106+
throw new Error("Method 'render()' must be implemented.");
107+
}
108+
getSummary() {
109+
throw new Error("Method 'getSummary()' must be implemented.");
110+
}
111+
}
112+
113+
class Article extends Content {
114+
constructor(title, body) {
115+
super();
116+
this.title = title;
117+
this.body = body;
118+
}
119+
render() {
120+
return `${this.title}<p>${this.body}</p>`;
121+
}
122+
getSummary() {
123+
return this.body.substring(0, 100) + "...";
124+
}
125+
}
126+
127+
class Video extends Content {
128+
constructor(title, videoUrl) {
129+
super();
130+
this.title = title;
131+
this.videoUrl = videoUrl;
132+
}
133+
render() {
134+
return `${this.title}<video src='${this.videoUrl}' controls></video>`;
135+
}
136+
getSummary() {
137+
return `${this.title} (Video)`;
138+
}
139+
}
140+
141+
class ImageGallery extends Content {
142+
constructor(title, images) {
143+
super();
144+
this.title = title;
145+
this.images = images;
146+
}
147+
render() {
148+
const imageTags = this.images.map(image => `<img src='${image}' />`).join('');
149+
return `${this.title}${imageTags}`;
150+
}
151+
getSummary() {
152+
return `${this.title} (${this.images.length} images)`;
153+
}
154+
}
155+
156+
class Audio extends Content {
157+
constructor(title, audioUrl) {
158+
super();
159+
this.title = title;
160+
this.audioUrl = audioUrl;
161+
}
162+
render() {
163+
return `${this.title}<audio src='${this.audioUrl}' controls></audio>`;
164+
}
165+
getSummary() {
166+
return `${this.title} (Audio)`;
167+
}
168+
}
169+
170+
function displayContent(content) {
171+
console.log("Rendering content:");
172+
console.log(content.render());
173+
console.log("Summary:");
174+
console.log(content.getSummary());
175+
}
176+
177+
const article1 = new Article("My Article", "This is the body of my article.");
178+
const video1 = new Video("My Video", "http://example.com/video.mp4");
179+
const imageGallery1 = new ImageGallery("My Gallery", ["http://example.com/image1.jpg", "http://example.com/image2.jpg"]);
180+
const audio1 = new Audio("My Audio", "http://example.com/audio.mp3");
181+
182+
displayContent(article1);
183+
displayContent(video1);
184+
displayContent(imageGallery1);
185+
displayContent(audio1);
186+
187+
188+
////////// ---------------------------------------- EXTRA ---------------------------------------- ////////////////////
189+
190+
class Vehicle{
191+
constructor(maxSpeed){
192+
if(new.target === Vehicle){
193+
throw new TypeError("Cannot construct Vehicle instances directly");
194+
}
195+
this.currentSpeed = 0;
196+
this.maxSpeed = maxSpeed
197+
}
198+
accelerate(increment){
199+
throw new Error("Method 'accelerate()' must be implemented.");
200+
}
201+
brake(decrement){
202+
throw new Error("Method 'brake()' must be implemented.");
203+
}
204+
toString() {
205+
return "Vehicle"
206+
}
207+
}
208+
209+
class Car extends Vehicle{
210+
constructor(maxSpeed){
211+
super(maxSpeed);
212+
}
213+
accelerate(increment){
214+
const newSpeed = this.currentSpeed + increment;
215+
if(newSpeed <= this.maxSpeed){
216+
this.currentSpeed = newSpeed;
217+
}else{
218+
this.currentSpeed = this.maxSpeed;
219+
}
220+
}
221+
brake(decrement){
222+
const newSpeed = this.currentSpeed - decrement;
223+
if(newSpeed >=0){
224+
this.currentSpeed = newSpeed;
225+
}else{
226+
this.currentSpeed = 0;
227+
}
228+
}
229+
toString(){
230+
return "Auto"
231+
}
232+
}
233+
234+
class Motorcycle extends Vehicle{
235+
constructor(maxSpeed){
236+
super(maxSpeed);
237+
}
238+
accelerate(increment){
239+
const newSpeed = this.currentSpeed + increment;
240+
if(newSpeed <= this.maxSpeed){
241+
this.currentSpeed = newSpeed;
242+
}else{
243+
this.currentSpeed = this.maxSpeed;
244+
}
245+
}
246+
brake(decrement){
247+
const newSpeed = this.currentSpeed - decrement;
248+
if(newSpeed >=0){
249+
this.currentSpeed = newSpeed;
250+
}else{
251+
this.currentSpeed = 0;
252+
}
253+
}
254+
toString(){
255+
return "Motocicleta"
256+
}
257+
}
258+
259+
class Boat extends Vehicle{
260+
constructor(maxSpeed){
261+
super(maxSpeed);
262+
}
263+
accelerate(increment){
264+
const newSpeed = this.currentSpeed + increment;
265+
if(newSpeed <= this.maxSpeed){
266+
this.currentSpeed = newSpeed;
267+
}else{
268+
this.currentSpeed = this.maxSpeed;
269+
}
270+
}
271+
brake(decrement){
272+
const newSpeed = this.currentSpeed - decrement;
273+
if(newSpeed >=0){
274+
this.currentSpeed = newSpeed;
275+
}else{
276+
this.currentSpeed = 0;
277+
}
278+
}
279+
toString(){
280+
return "Bote"
281+
}
282+
}
283+
284+
function testVehicle(vehicle){
285+
console.log(`Datos: ${vehicle.toString()}:`);
286+
console.log(`Velocidad inicial: ${vehicle.currentSpeed} km/h`);
287+
vehicle.accelerate(50);
288+
console.log(`Velocidad despues de acelerar: ${vehicle.currentSpeed} km/h`);
289+
vehicle.brake(20);
290+
console.log(`Velocidad despues de frenar: ${vehicle.currentSpeed} km/h`);
291+
}
292+
293+
const car = new Car(180);
294+
const motorcycle = new Motorcycle(150);
295+
const boat = new Boat(40);
296+
297+
testVehicle(car);
298+
testVehicle(motorcycle);
299+
testVehicle(boat);
300+

0 commit comments

Comments
 (0)