CodeGym /Kursy /Frontend SELF PL /Miksy i kompozycja

Miksy i kompozycja

Frontend SELF PL
Poziom 40 , Lekcja 4
Dostępny

11.1 Miksy

Miksy i kompozycja to potężne narzędzia do organizacji i ponownego użycia kodu w JavaScript. Oferują alternatywne podejścia do tradycyjnego dziedziczenia, pozwalając na tworzenie elastycznych i modułowych systemów.

Miksy to sposób na ponowne użycie kodu, który umożliwia dodanie funkcjonalności do klas bez użycia dziedziczenia. Miks to obiekt, który zawiera metody i właściwości, które mogą być kopiowane do innych klas lub obiektów.

Przykład użycia miksów:

JavaScript
    
      const CanEat = {
        eat() {
          console.log('Eating...');
        }
      };

      const CanWalk = {
        walk() {
          console.log('Walking...');
        }
      };

      class Person {
        constructor(name) {
          this.name = name;
        }
      }

      // Kopiujemy metody z miksów do prototypu klasy
      Object.assign(Person.prototype, CanEat, CanWalk);

      const person = new Person('John');

      person.eat();  // Wyświetli: Eating...
      person.walk(); // Wyświetli: Walking...
    
  

Zalety miksów:

  1. Ponowne użycie kodu: miksy pozwalają łatwo dzielić się wspólnymi metodami i właściwościami między klasami.
  2. Elastyczność: możesz wybierać, które miksy zastosować do klas, zapewniając bardziej elastyczną organizację kodu.
  3. Obchodzenie ograniczeń dziedziczenia: miksy pozwalają dodawać funkcjonalność bez potrzeby tworzenia skomplikowanych hierarchii dziedziczenia.

Problemy miksów:

  1. Konflikty nazw: przy łączeniu kilku miksów mogą wystąpić konflikty nazw metod lub właściwości.
  2. Nieoczywistość struktury: miksy mogą uczynić strukturę klas mniej oczywistą, co utrudnia utrzymanie kodu.

11.2 Kompozycja

Kompozycja to podejście, w którym obiekty są tworzone poprzez łączenie kilku obiektów lub funkcji w celu tworzenia bardziej złożonego zachowania. Kompozycja pozwala budować systemy z małych, niezależnych modułów, co czyni kod bardziej elastycznym i łatwo rozszerzalnym.

Przykład 1: Kompozycja funkcji

JavaScript
    
      function canEat(obj) {
        obj.eat = function() {
          console.log('Eating...');
        };
      }

      function canWalk(obj) {
        obj.walk = function() {
          console.log('Walking...');
        };
      }

      function Person(name) {
        this.name = name;
      }

      const person = new Person('John');
      canEat(person);
      canWalk(person);

      person.eat();  // Wyświetli: Eating...
      person.walk(); // Wyświetli: Walking...
    
  

Przykład 2: Kompozycja z klasami

JavaScript
    
      class CanEat {
        eat() {
          console.log('Eating...');
        }
      }
      
      class CanWalk {
        walk() {
          console.log('Walking...');
        }
      }
      
      class Person {
        constructor(name) {
          this.name = name;
          // Tworzymy instancje CanEat i CanWalk
          this.eater = new CanEat();
          this.walker = new CanWalk();
        }
      
        // Delegujemy metody odpowiednim instancjom 
        eat() {
          this.eater.eat();
        }
      
        walk() {
          this.walker.walk();
        }
      }
      
      const person = new Person('John');
      
      person.eat();  // Wyświetli: Eating...
      person.walk(); // Wyświetli: Walking...
    
  

Zalety kompozycji:

  1. Elastyczność: kompozycja pozwala łatwo łączyć różne aspekty zachowań i ponownie używać ich w różnych kontekstach.
  2. Modularność: kompozycja sprzyja tworzeniu małych, niezależnych modułów, co ułatwia testowanie i utrzymanie kodu.
  3. Obchodzenie ograniczeń dziedziczenia: kompozycja unika problemów związanych z głęboką hierarchią klas i wielokrotnym dziedziczeniem.

Problemy kompozycji:

  1. Złożoność implementacji: kompozycja może wymagać bardziej złożonej logiki do łączenia funkcjonalności.
  2. Nadwyżka kodu: w niektórych przypadkach kompozycja może prowadzić do nadmiaru kodu, ponieważ trzeba jawnie łączyć metody i właściwości.

11.3 Porównanie miksów i kompozycji

Miksy:

  • Łatwo użyć do dodania funkcjonalności wielu klasom
  • Mogą prowadzić do konfliktów nazw i nieoczywistości struktury

Kompozycja:

  • Bardziej elastyczna i modułowa
  • Unika problemów związanych z dziedziczeniem, ale może być trudniejsza do zrealizowania i utrzymania
1
Zadanie
Frontend SELF PL, poziom 40, lekcja 4
Niedostępne
Miksy funkcjonalności
Miksy funkcjonalności
1
Zadanie
Frontend SELF PL, poziom 40, lekcja 4
Niedostępne
Kompozycja funkcji
Kompozycja funkcji
Komentarze
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION