https://developer.mozilla.org/en-US/docs/Learn/JavaScript/Objects/Object-oriented_programming
Objects are self-contained blocks of code. Objects are building blocks of application and interact with one another. Interactions happen through application programming interface (API).
OOP paradigm is designed to organize and maintain code.
Class - blueprint for creating new objects - instances. Instance - object, created from class.
Class => (instantiation) => Instance
Abstraction - ignoring and hiding details that don't matter...
Encapsulation - keeping properties and methods private inside the class, so they aren't accessible outside. Some methods can be exposed as API.
Inheritance - all properties and methods of parent class available to child class.
Polymorphism - child class can overwrite method, inherited from parent class.
JavaScript Object => (prototypal inheritance) => Prototype.
JavaScript Object delegates methods to Prototype.
How to create prototypes? Constructor functions - poplar used technique, ES6 Classes - "syntactic sugar" using constructor functions, Object.create() - simple and straightforward way.
prototype basically is prototype of linked objects, NOT prototype of Person => Person.prototype
Person.prototype is prototype of all objects, created with Person constructor function.
const Person = function (firstName, birthYear) { // constructor function
this.firstName = firstName; // instance property
this.birthYear = birthYear; // instance property
this.calcAge = function () { // Never create methods in constructor functions!!!
console.log(2022 - this.birthYear);
};
};
const john = new Person('John', 1991);
console.log(john);
// 1. New {} is created
// 2. function is called, this = {}
// 3. {} linked to prototype => __proto__ for example console.log(john.__proto__);
// 4. function automatically return {}
Person.prototype.calcAge = function () { // prototypal inheritance
console.log(2022 - this.birthYear);
};
john.calcAge();
isPrototypeOf , hasOwnProperty
Classes are: 1) not hoisted, 2) first-class citizens, 3) executed in strict mode.
const Person = class {} // class expression
// class declaration
class Person {
constructor(firstName, birthYear) {
this.firstName = firstName; // instance property
this.birthYear = birthYear; // instance property
}
calcAge() {
console.log(2022 - this.birthYear);
}
otherMethod() {
console.log(`${someMethod}`);
}
}
const john = new Person('John', 1991);
// Object.create()
const PersonProto = {
calcAge() {
console.log(2022 - this.birthYear);
},
init(firstName, birthYear) {
this.firstName = firstName; // instance property
this.birthYear = birthYear; // instance property
},
};
const john = Object.create(PersonProto);
john.init('John', 1991);
john.calcAge();
No comments:
Post a Comment