Skip to content

Commit 91068ec

Browse files
feat: update oop.js
1 parent 69076e9 commit 91068ec

File tree

1 file changed

+70
-78
lines changed

1 file changed

+70
-78
lines changed

part6 (Object-Oriented Programming)/01_oop.js

Lines changed: 70 additions & 78 deletions
Original file line numberDiff line numberDiff line change
@@ -11,145 +11,138 @@ Polymorphism
1111
Abstraction
1212
*/
1313

14-
1514
/*
1615
✅ 1. Classes & Objects
1716
Classes
1817
A blueprint for creating objects (like a template).
1918
*/
2019
class Person {
21-
constructor(name, age) {
22-
this.name = name; // Property
23-
this.age = age;
24-
}
25-
26-
greet() { // Method
27-
console.log(`Hello, my name is ${this.name} and I am ${this.age} years old.`);
28-
}
20+
constructor(name, age) {
21+
this.name = name; // Property
22+
this.age = age;
23+
}
24+
25+
greet() {
26+
// Method
27+
console.log(
28+
`Hello, my name is ${this.name} and I am ${this.age} years old.`,
29+
);
30+
}
2931
}
3032

3133
// Creating Objects (instances)
32-
const person1 = new Person('Alice', 30);
33-
const person2 = new Person('Bob', 25);
34+
const person1 = new Person("Alice", 30);
35+
const person2 = new Person("Bob", 25);
3436

3537
person1.greet(); // Hello, my name is Alice and I am 30 years old.
3638
person2.greet(); // Hello, my name is Bob and I am 25 years old.
3739

38-
39-
4040
/*
4141
✅ 2. Encapsulation
4242
Hiding the internal state of an object and only exposing necessary parts.
4343
In JavaScript, we use private fields (#) to implement encapsulation.
4444
*/
4545
class Car {
46-
#engine; // Private property
46+
#engine; // Private property
4747

48-
constructor(model, engine) {
49-
this.model = model;
50-
this.engine = engine;
51-
}
48+
constructor(model, engine) {
49+
this.model = model;
50+
this.engine = engine;
51+
}
5252

53-
startEngine() {
54-
console.log(`Starting the ${this.#engine} engine of ${this.model}.`);
55-
}
53+
startEngine() {
54+
console.log(`Starting the ${this.#engine} engine of ${this.model}.`);
55+
}
5656
}
5757

58-
const myCar = new Car('Tesla', 'Electric');
58+
const myCar = new Car("Tesla", "Electric");
5959
myCar.startEngine(); // Startng the Electric engine of Tesla.
6060
console.log(myCar.#engine); // Error private field
6161

62-
63-
6462
/*
6563
✅ 3. Inheritance
6664
Creating new classes from existing ones (Parent-Child relationship).
6765
Super keyword is used to call the constructor of the parent class.
6866
*/
6967
class Animal {
70-
constructor(name) {
71-
this.name = name;
72-
}
68+
constructor(name) {
69+
this.name = name;
70+
}
7371

74-
makeSound() {
75-
console.log(`${this.name} makes a sound.`);
76-
}
72+
makeSound() {
73+
console.log(`${this.name} makes a sound.`);
74+
}
7775
}
7876

7977
class Dog extends Animal {
80-
constructor(name, breed) {
81-
super(name); // Call the parent contructor
82-
this.breed = breed;
83-
}
84-
85-
makeSound() {
86-
console.log(`${this.name} barks.`);
87-
}
78+
constructor(name, breed) {
79+
super(name); // Call the parent contructor
80+
this.breed = breed;
81+
}
82+
83+
makeSound() {
84+
console.log(`${this.name} barks.`);
85+
}
8886
}
8987

90-
const dog1 = new Dog('Buddy', 'Golden Retriever');
88+
const dog1 = new Dog("Buddy", "Golden Retriever");
9189
dog1.makeSound(); // Buddy barks.
9290

93-
94-
9591
/*
9692
✅ 4. Polymorphism
9793
The ability of objects to take on many forms.
9894
A child class can have a method with the same name as the parent class (Method Overriding).
9995
*/
10096
class Shape {
101-
draw() {
102-
console.log('Drawing a shape.');
103-
}
97+
draw() {
98+
console.log("Drawing a shape.");
99+
}
104100
}
105101

106102
class Circle extends Shape {
107-
draw() {
108-
console.log('Drawing a circle.');
109-
}
103+
draw() {
104+
console.log("Drawing a circle.");
105+
}
110106
}
111107

112108
class Square extends Shape {
113-
draw() {
114-
console.log('Drawing a square.');
115-
}
109+
draw() {
110+
console.log("Drawing a square.");
111+
}
116112
}
117113

118114
const shapes = [new Circle(), new Square(), new Shape()];
119115

120-
shapes.forEach(shape => shape.draw());
116+
shapes.forEach((shape) => shape.draw());
121117
// Output:
122118
// Drawing a circle.
123119
// Drawing a square.
124120
// Drawing a shape.
125121

126-
127-
128-
129122
/*
130123
✅ 5. Abstraction
131124
Hiding complexity by exposing only necessary details.
132125
JavaScript doesn't have true abstraction but we can achieve it using classes, interfaces (via TypeScript), and encapsulation.
133126
*/
134127
class User {
135-
constructor(username, password) {
136-
this.username = username;
137-
this.#password = password; // Private field
138-
}
139-
140-
#encryptPassword() { // Private method
141-
return this.#password.split('').reverse().join('');
142-
}
143-
144-
getEncryptedPassword() {
145-
return this.#encryptPassword();
146-
}
128+
constructor(username, password) {
129+
this.username = username;
130+
this.#password = password; // Private field
131+
}
132+
133+
#encryptPassword() {
134+
// Private method
135+
return this.#password.split("").reverse().join("");
136+
}
137+
138+
getEncryptedPassword() {
139+
return this.#encryptPassword();
140+
}
147141
}
148142

149-
const user1 = new User('Alice', 'mypassword');
143+
const user1 = new User("Alice", "mypassword");
150144
console.log(user1.getEncryptedPassword()); // drowssapym
151145

152-
153146
/*
154147
🔥 Summary of Important Things to Remember:
155148
Classes are templates for creating objects.
@@ -160,18 +153,17 @@ Abstraction simplifies usage by hiding complex details.
160153
Getters & Setters provide controlled access to properties.
161154
*/
162155

163-
164156
// INFO: First Quiz
165157
class Car {
166-
constructor(brand, model) {
167-
this.brand = brand;
168-
this.model = model;
169-
};
170-
171-
displayInfo() {
172-
console.log(`Brand: [${this.brand}], Model: [${this.model}]`)
173-
};
158+
constructor(brand, model) {
159+
this.brand = brand;
160+
this.model = model;
161+
}
162+
163+
displayInfo() {
164+
console.log(`Brand: [${this.brand}], Model: [${this.model}]`);
165+
}
174166
}
175167

176-
const car = new Car('Toyota', 'Coralla');
168+
const car = new Car("Toyota", "Coralla");
177169
car.displayInfo(); // Brand: [Toyota], Model: [Coralla]

0 commit comments

Comments
 (0)