Heim Web-Frontend js-Tutorial Meine Reaktionsreise: Tag 15

Meine Reaktionsreise: Tag 15

Dec 16, 2024 am 12:47 AM

My React Journey: Day 15

Objektorientierte Programmierung (OOP)
Objektorientierte Programmierung ist ein Programmierparadigma, das auf dem Konzept von Objekten basiert.

Grundprinzipien von OOP
1. Kapselung:

  • Gruppiert verwandte Variablen und Funktionen in einem Objekt.
  • Fördert weniger Parameter in Funktionen und reduziert so die Komplexität. Beispiel:
function Circle(radius) {
    this.radius = radius;
    this.draw = function() {
        console.log('draw');
    };
}
const circle = new Circle(5);
console.log(circle.radius); // Access encapsulated property
circle.draw(); // Call encapsulated method
Nach dem Login kopieren

2.Abstraktion:

Versteckt die Details und die Komplexität und legt nur die notwendigen Teile eines Objekts frei.
Vereinfacht die Schnittstelle und reduziert die Auswirkungen von Änderungen im zugrunde liegenden Code.
Beispiel: Methoden abstrahieren und gleichzeitig die interne Logik verbergen.

3.Vererbung:

Ermöglicht einer Klasse (untergeordneten Klasse), Eigenschaften und Methoden von einer anderen Klasse (übergeordneten Klasse) zu erben.
Reduziert redundanten Code.
Beispiel:

class Animal {
    eat() {
        console.log("This animal is eating.");
    }
}
class Dog extends Animal {
    bark() {
        console.log("The dog is barking.");
    }
}
const dog = new Dog();
dog.eat(); // Inherited from Animal
dog.bark();
Nach dem Login kopieren

4.Polymorphismus:

Bezieht sich auf Objekte in vielen Formen.
Ermöglicht eine einheitliche Schnittstelle für verschiedene Objekttypen und ermöglicht so die Wiederverwendung von Code und Flexibilität.
Beispiel:

class Animal {
    sound() {
        console.log("This animal makes a sound.");
    }
}
class Dog extends Animal {
    sound() {
        console.log("The dog barks.");
    }
}
const animal = new Animal();
const dog = new Dog();
animal.sound(); // Output: This animal makes a sound.
dog.sound();    // Output: The dog barks.
Nach dem Login kopieren

Bedeutung von OOP

  • Kapselung: Reduziert die Komplexität und verbessert die Wiederverwendbarkeit.
  • Abstraktion: Versteckt Implementierungsdetails und vereinfacht die Interaktion.
  • Vererbung: Eliminiert Codeduplizierung und fördert die Wiederverwendung.
  • Polymorphismus: Ermöglicht Flexibilität und optimierte Codestrukturen.

Praxisbeispiele
Klassen und Konstruktoren

  • Strukturierte, saubere Art, Objekte zu erstellen.
  • Beispiel:
class Product {
    constructor(name, price) {
        this.name = name;
        this.price = price;
    }

    displayProduct() {
        console.log(`Product: ${this.name}`);
        console.log(`Price: $${this.price.toFixed(2)}`);
    }

    calculateTotal(salesTax) {
        return this.price + this.price * salesTax;
    }
}

const product1 = new Product("Laptop", 1200);
product1.displayProduct();
console.log(`Total Price: $${product1.calculateTotal(0.1).toFixed(2)}`);
Nach dem Login kopieren

Vererbung mit Tieren

  • Demonstriert die Wiederverwendbarkeit und das Überschreiben von Methoden.
  • Beispiel:
class Animal {
    eat() {
        console.log("This animal eats food.");
    }
}

class Bird extends Animal {
    fly() {
        console.log("This bird can fly.");
    }
}

const bird = new Bird();
bird.eat();
bird.fly();
Nach dem Login kopieren

Reflexion
Was ich gelernt habe:

  • Kern-OOP-Prinzipien: Kapselung, Abstraktion, Vererbung, Polymorphismus.
  • Praktische Anwendungsfälle zur Reduzierung der Codekomplexität und Verbesserung der Wiederverwendbarkeit.
  • Anwenden von Konstruktoren, Methoden und Vererbung zur Lösung realer Probleme.

OOP ist eine andere Ebene.

Morgen geht es wieder los!

Das obige ist der detaillierte Inhalt vonMeine Reaktionsreise: Tag 15. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn

Heiße Artikel -Tags

Notepad++7.3.1

Notepad++7.3.1

Einfach zu bedienender und kostenloser Code-Editor

SublimeText3 chinesische Version

SublimeText3 chinesische Version

Chinesische Version, sehr einfach zu bedienen

Senden Sie Studio 13.0.1

Senden Sie Studio 13.0.1

Leistungsstarke integrierte PHP-Entwicklungsumgebung

Dreamweaver CS6

Dreamweaver CS6

Visuelle Webentwicklungstools

SublimeText3 Mac-Version

SublimeText3 Mac-Version

Codebearbeitungssoftware auf Gottesniveau (SublimeText3)

Ersetzen Sie Stringzeichen in JavaScript Ersetzen Sie Stringzeichen in JavaScript Mar 11, 2025 am 12:07 AM

Ersetzen Sie Stringzeichen in JavaScript

Benutzerdefinierte Google -Search -API -Setup -Tutorial Benutzerdefinierte Google -Search -API -Setup -Tutorial Mar 04, 2025 am 01:06 AM

Benutzerdefinierte Google -Search -API -Setup -Tutorial

Beispielfarben JSON -Datei Beispielfarben JSON -Datei Mar 03, 2025 am 12:35 AM

Beispielfarben JSON -Datei

8 atemberaubende JQuery -Seiten -Layout -Plugins 8 atemberaubende JQuery -Seiten -Layout -Plugins Mar 06, 2025 am 12:48 AM

8 atemberaubende JQuery -Seiten -Layout -Plugins

10 JQuery Syntax Highlighters 10 JQuery Syntax Highlighters Mar 02, 2025 am 12:32 AM

10 JQuery Syntax Highlighters

Erstellen Sie Ihre eigenen AJAX -Webanwendungen Erstellen Sie Ihre eigenen AJAX -Webanwendungen Mar 09, 2025 am 12:11 AM

Erstellen Sie Ihre eigenen AJAX -Webanwendungen

Was ist ' this ' in JavaScript? Was ist ' this ' in JavaScript? Mar 04, 2025 am 01:15 AM

Was ist ' this ' in JavaScript?

10 JavaScript & JQuery MVC -Tutorials 10 JavaScript & JQuery MVC -Tutorials Mar 02, 2025 am 01:16 AM

10 JavaScript & JQuery MVC -Tutorials

See all articles