Sobes.tech
Middle+

Aan welke datastructuur in JavaScript lijkt het Observable-object?

sobes.tech AI

Antwoord van AI

De gegevensstructuur Cold Observable (van het Engels, Cold Observable), die een concept uit de reactieve programmering is (bijvoorbeeld in de RxJS-bibliotheek).

Belangrijke overeenkomsten:

  • Trage aard: Een Observable begint waarden uit te zenden alleen wanneer er een abonnee is. Zonder abonnement is de Observable niet actief.
  • Meerdere abonnees, onafhankelijke stromen: Elke nieuwe abonnee ontvangt de volledige reeks waarden vanaf het begin, onafhankelijk van andere abonnees. Dit creëert onafhankelijke datastromen voor elke abonnee.

Voorbeeld van een Cold Observable-structuur (conceptueel):

// Stel je voor dat dit een "generator" van waarden is
function generateValues() {
  let i = 0;
  return {
    // Methode die de volgende waarde retourneert (wanneer gevraagd)
    next: function() {
      return { value: i++, done: false };
    }
  };
}

// "Observable" - in wezen, gewoon een functie die een abonnee accepteert
function coldObservableExample(subscriber) {
  const generator = generateValues();

  // Emulatie van het uitzenden van waarden
  setTimeout(() => {
    subscriber.next(generator.next().value);
  }, 100);

  setTimeout(() => {
    subscriber.next(generator.next().value);
  }, 200);

  setTimeout(() => {
    subscriber.complete(); // Voltooiing van de stroom
  }, 300);

  // Retourneert een abonnement-object (om af te melden)
  return {
    unsubscribe: () => {
      console.log('Afmelden');
      // Hier zou logica kunnen staan om generator/timers te stoppen
    }
  };
}

// Abonnee 1
const subscription1 = coldObservableExample({
  next: (value) => console.log('Abonnee 1 ontving:', value),
  error: (err) => console.error('Fout 1:', err),
  complete: () => console.log('Abonnee 1 voltooid')
});

// Abonnee 2 (begint waarden vanaf het begin te ontvangen)
setTimeout(() => {
  const subscription2 = coldObservableExample({
    next: (value) => console.log('Abonnee 2 ontving:', value),
    error: (err) => console.error('Fout 2:', err),
    complete: () => console.log('Abonnee 2 voltooid')
  });
}, 150);

// Afmelden van de eerste abonnee
setTimeout(() => {
  subscription1.unsubscribe();
}, 250);

In tegenstelling tot de Hot Observable, die onmiddellijk begint met waarden uitzenden, ongeacht de abonnees, en alle abonnees de waarden vanaf het moment van abonneren ontvangen, bewaart en reproduceert de Cold Observable de volledige gegevensstroom voor elke nieuwe abonnee. Deze eigenschap brengt het dichter bij het concept van Observable in JavaScript (in de context van RxJS en soortgelijke bibliotheken).

Vergelijking (vereenvoudigd):

Kenmerk Cold Observable Hot Observable
Begin van uitzending Bij abonneren Onmiddellijk
Stroom voor abonnees Volledige stroom voor ieder Waarden vanaf het moment van abonneren
Gebruik HTTP-verzoeken, bestandslezing, iteratie DOM-evenementen, websockets, timers