refactor: class

Author: brijeshkumar-chavda

28_object_oriented_programming/1_object.js

@@ -1,5 +1,7 @@
 // Object
 
+// Object-oriented programming (OOP): It is a programming paradigm that organizes code into objects, which are instances of classes. It provides a way of structuring programs by representing real-world entities or concepts as objects that have data (attributes or properties) and behaviors (methods or functions).
+
 // What
 // - It is collection of properties and method.
 

28_object_oriented_programming/6_prototype_part_2.js

@@ -0,0 +1,56 @@
+// Adding the custom method to the JavaScript Origin Object.
+Object.prototype.customMethod = function () {
+  console.log("I am the origin object's custom method.");
+};
+
+const childObject = {
+  key: "value",
+
+  method: function () {
+    console.log("I am the child object's method");
+  },
+};
+
+// Accessing method from child object
+console.log(childObject.method());
+
+// Accessing custom method from origin object because of prototype
+console.log(childObject.customMethod());
+
+// Because of the custom method is in origin object. You can access it form where ever
+const array = [1, 2, 3, 4, 5];
+console.log(array.customMethod());
+
+// __proto__
+
+// __proto__ is property in object to set other object as a property.
+// Prototype is name for theory discussion.
+// __proto__ is name for actual code.
+
+const grandFather = {
+  grandFatherCar: "Doge Charger 1960",
+};
+
+const father = {
+  fatherCar: "BMW M3 GTR",
+  //   __proto__: grandFather,
+};
+
+const child = {
+  childCar: "Hot wheels",
+  //   __proto__: father,
+};
+
+// console.log(child.grandFatherCar);
+// console.log(child.fatherCar);
+// console.log(child.childCar);
+
+// Modern Syntax
+
+// Setting up the prototype chain using Object.setPrototypeOf
+Object.setPrototypeOf(father, grandFather);
+Object.setPrototypeOf(child, father);
+
+console.log(child.grandFatherCar);
+console.log(child.fatherCar);
+console.log(child.childCar);

29_call/1_call.js

@@ -0,0 +1,42 @@
+// .call()
+
+// What
+// - The .call() method in JavaScript is a special method available on all functions. It allows you to call a function and specify what this should refer to inside that function.
+
+// Why
+// - In JavaScript, the value of this inside a function depends on how the function is called.
+// - Sometimes, you might want to call a function in a way that this refers to a specific object
+// - The.call() method gives you that control.
+
+// Example - 1
+function setUsername(username) {
+  this.username = username;
+}
+
+function CreateUser(username, email, password) {
+  // Using .call() to set the context of this to the current instance
+  setUsername.call(this, username);
+
+  this.email = email;
+  this.password = password;
+}
+
+const userOne = new CreateUser("testUser", "[email protected]", "123");
+console.log(userOne);
+
+// Example - 2
+const person = {
+  firstName: "John",
+  lastName: "Doe",
+  fullName: function () {
+    return this.firstName + " " + this.lastName;
+  },
+};
+
+const anotherPerson = {
+  firstName: "Jane",
+  lastName: "Smith",
+};
+
+// Call the fullName method of person, but set `this` to anotherPerson
+console.log(person.fullName.call(anotherPerson));

pending_concept/CallApplyBind/3Bind.js 29_call/2_Bind.js

@@ -0,0 +1,79 @@
+// Class
+
+// What
+// - A class in JavaScript is a blueprint for creating objects.
+// - It encapsulates data and behavior(methods) that objects created from the class will share.
+// - Classes were introduced in ECMAScript 6(ES6) to provide a cleaner and more intuitive way to create and manage objects and their relationships.
+
+// Why
+// - Organization: They help organize code by grouping related data and behavior.
+// - Reusability: Code can be reused more effectively by creating multiple objects from the same class.
+// - Inheritance: They allow for inheritance, where one class can extend another and inherit its properties and methods.
+// - Encapsulation: They help encapsulate and hide the complexity of data and behavior within a class.
+
+// Syntax
+// 1. Creating class using `class` keyword
+class MyClass {
+  constructor(parameter1, parameter2) {
+    this.parameter1 = parameter1;
+    this.parameter2 = parameter2;
+  }
+
+  method() {
+    console.log(`We are ${this.parameter1} & ${this.parameter2}`);
+    console.log("I am method");
+  }
+}
+
+const instanceObject = new MyClass("argument1", "argument2");
+console.log(instanceObject.method());
+
+// 2. Creating class with class expression
+const variable = class {
+  constructor() {}
+};
+
+// Example
+class User {
+  constructor(username, email, password) {
+    this.username = username;
+    this.email = email;
+    this.password = password;
+  }
+
+  encryptPassword() {
+    return `${this.password}abc`;
+  }
+
+  changeUsername() {
+    return `${this.username.toUpperCase()}`;
+  }
+}
+
+const userOne = new User("userOne", "[email protected]", "123");
+console.log(userOne.encryptPassword());
+console.log(userOne.changeUsername());
+
+// Behind the Scene
+function CreateUser(username, email, password) {
+  this.username = username;
+  this.email = email;
+  this.password = password;
+}
+
+CreateUser.prototype.encryptPassword = function () {
+  return `${this.password}abc`;
+};
+CreateUser.prototype.changeUsername = function () {
+  return `${this.username.toUpperCase()}`;
+};
+
+const user = new CreateUser("user", "[email protected]", "123");
+console.log(user.encryptPassword());
+console.log(user.changeUsername());
+
+// Note
+// - Class in JavaScript doesn't work like other programming language. It's just a syntactic sugar which look like we are using class but in the background it is using  Constructor Function and Prototype Inheritance.
+// - Always add a method named constructor();
+// - Class can't be hoisted.
+// - Class are first class citizen just like first class function.

30_class/1_class.js

@@ -0,0 +1,41 @@
+// Inheritance
+
+// Example
+class User {
+  constructor(username) {
+    this.username = username;
+  }
+
+  printUsername() {
+    console.log(`Username is ${this.username}`);
+  }
+}
+
+// Backstory
+// - Do you remember we are using the __proto__ (Prototype) to connect two object to share parent object properties and method for child object.
+// - We are doing same thing here. Just form of class and extends keywords. It's syntactic sugar.
+// - Like how we create object using the object literal, here we are using class to create object (Fancy name is "instance").
+// - Now extending so called class to another class via `extends` keyword === __proto__
+
+class Teacher extends User {
+  constructor(username, email, password) {
+    // - The `super` keyword in JavaScript is crucial for working with class inheritance. It allows subclasses to initialize and utilize parent class properties and methods,
+    super(username);
+
+    this.email = email;
+    this.password = password;
+  }
+
+  addCourse() {
+    return console.log(`Course Instructor: ${this.username}`);
+  }
+}
+
+const sam = new Teacher("samwhite", "[email protected]", "123");
+sam.addCourse();
+
+console.log(sam === Teacher);
+console.log(sam === User);
+
+console.log(sam instanceof Teacher);
+console.log(sam instanceof User);

30_class/2_inheritance.js

@@ -0,0 +1,44 @@
+// Static
+
+// What
+// - Static is a keyword in JavaScript used to define static methods and properties for a class.
+// - Static properties cannot be directly accessed on instances of the class. Instead, they're accessed on the class itself.
+
+// Why
+// - Static methods and properties are used when you want to create functions or data that are not tied to any specific instance of a class.
+
+// How
+// - You can define a static method or property by using the static keyword inside a class definition.
+
+// Syntax
+class ClassName {
+  static staticPropertyName = "value";
+  static staticMethodName() {
+    console.log(`I am static method`);
+  }
+}
+
+console.log(ClassName.staticMethodName());
+
+// Example
+class User {
+  static company = "ABC Company";
+
+  constructor(username, email, password) {
+    this.username = username;
+    this.email = email;
+    this.password = username;
+  }
+
+  static createId() {
+    return `123`;
+  }
+
+  getUsername() {
+    console.log(`Username: ${this.username}`);
+  }
+}
+
+const userOne = new User("userOne");
+// console.log(userOne.createId());
+console.log(User.createId());