Heim > Web-Frontend > js-Tutorial > Fluent Streams: Eine Bibliothek für die Manipulation umfangreicher Iterables

Fluent Streams: Eine Bibliothek für die Manipulation umfangreicher Iterables

Susan Sarandon
Freigeben: 2024-12-15 16:24:16
Original
208 Leute haben es durchsucht

Fluent Streams: A Library for Rich Iterables Manipulation

Kunstwerk: https://code-art.pictures/

Stellen Sie sich eine Bibliothek vor, die:

  • Bietet wie Ramda viele nützliche Funktionen zur Iterables-Manipulation
  • Liest sich vertraut, wie standardmäßige iterative Array-Methoden
  • Versucht nicht, integrierte JavaScript-Funktionen wie Array, Set oder das Iterationsprotokoll zu ersetzen
  • Enthält wie Java Streams Optional, um klar zwischen „kein Wert“ und „nicht als Wert definiert“ zu unterscheiden
  • Ist kompakt in Bezug auf die Bündelgröße

Ich konnte keine finden, die alle diese Anforderungen erfüllt, also habe ich meine kleine Bibliothek erstellt – fluent-streams.

Reden ist billig. Zeigen Sie mir den Code

Top 3 Wörter in einem Text

const words = ['Lorem', 'ipsum', /* ... */]
stream(words)
  .groupBy(word => word.toLowerCase())
  .map(([word, list]) => [word, list.length])
  .sortBy(([, length])  => -length)
  .take(3)
  .toArray()

// => ['ut', 3], ['in', 3], ['dolor', 2]
Nach dem Login kopieren

Koprime-Ganzzahlen

// Endless stream of 2..999 integers
const randomInts = continually(() => 
  2 + Math.floor(Math.random() * 998)
)

randomInts
  .zip(randomInts)
  .filter(([a, b]) => gcd(a, b) === 1)
  .distinctBy(pair => stream(pair).sortBy(i => i).join())
  .take(10)

// => [804, 835], [589, 642], [96, 145], ...
Nach dem Login kopieren
  • Streams können endlos sein, wie gezeigt, aber Sie können sie mithilfe der take(n)-Methode auf die ersten n Elemente beschränken
  • Ein Stream kann mehrfach, auch parallel, wiederverwendet werden. Dies liegt daran, dass Streams zustandslos sind und nur einen Verweis auf die Eingabe speichern. Der Zustand wird nur erstellt, wenn der Stream einen Iterator erzeugt.

Erstelle ein Kartenspiel

const deck = streamOf('♠', '♥', '♣', '♦')
  .flatMap(suit =>
    streamOf<string | number>(
      'A',
      ...range(2, 11),
      'J',
      'Q',
      'K'
    ).map(rank => `${rank}${suit}`)
  )

// => 'A♠', '2♠', '3♠', ...
Nach dem Login kopieren

Und spielen Sie Hold'em Poker!

  const playersNum = 2
  const [flop, turn, river, ...hands] = deck
    .takeRandom(3 + 1 + 1 + playersNum * 2)
    .zipWithIndex()
    .splitWhen((_, [, j]) =>
      j === 3            // flop
      || j === 4         // turn
      || j >= 5          // river
         && j % 2 === 1  // ...players' hands
    )
    .map(chunk =>
      // Unzip index
      chunk.map(([card]) => card)
    )

// flop = ['3♦', '9♣', 'J♦']
// turn = ['4♣']
// river = ['7♦']
// hands = ['J♠', '4♥'], ['10♠', '8♥']
Nach dem Login kopieren

Der erste Spieler hat ein Paar Buben am Flop, während der zweite Spieler eine Straße bekommt, aber nur am River. Wer wird gewinnen?

Das muss billig sein

Alles oben Genannte kann nur mit nativen Datenstrukturen erreicht werden. Mit Fluent Streams geschriebener Code liest sich jedoch besser. Obwohl es ein durchaus gültiges Ziel ist, Code besser lesbar zu machen, sollten die Kosten für die Erreichung dieses Ziels im Hinblick auf kognitive Belastung, Bundle-Größe und Leistung gering sein.

Und genau das ist bei Fluent Streams der Fall! Hier ist der Grund:

  • Keine Lernkurve: Die API fühlt sich vertraut an und ähnelt Standard-Array-Methoden. Es lässt sich leicht hinzufügen und ebenso leicht wieder entfernen.
  • Keine Neuerfindung: Die Bibliothek erstellt keine neuen Datenstrukturen oder Protokolle – sie baut auf den bereits robusten Funktionen von JavaScript auf.
  • Minimale Bundle-Auswirkungen: Mit nur 8,5 kB verkleinert ist es leichtgewichtig. Wenn Ihr Projekt bereits React und seine Satellitenbibliotheken enthält, die Hunderte von Kilobyte wiegen, fällt dieser Zusatz kaum auf.
  • Verzögerte Verarbeitung: Die Bibliothek verarbeitet Elemente träge, was die Speichernutzung reduzieren und die Effizienz in langen Pipelines verbessern kann, indem unnötiges Zwischenkopieren von Daten vermieden wird.

Vorbehalte

Die Bibliothek wird untranspiliert an ES5 geliefert. Diese Entscheidung basiert auf dem Wunsch, eine kleine Bundle-Größe beizubehalten, was durch die Nutzung von ES6-Funktionen erreicht wird, die eine Iteration mit sehr prägnantem Code ermöglichen – insbesondere Generatoren. Es werden jedoch nur weithin unterstützte Sprachfunktionen genutzt.

Wenn Sie noch auf ES5 transpilieren, können Sie die Bibliothek verwenden, indem Sie sie selbst transpilieren und Polyfills hinzufügen. Beachten Sie jedoch, dass dadurch die Paketgröße zunimmt, weshalb dies nicht empfohlen wird. Stattdessen könnte dies die perfekte Gelegenheit sein, Ihre Build-Konfiguration zu überdenken und moderne JavaScript-Funktionen zu nutzen.

Viel Spaß beim Codieren!

Das obige ist der detaillierte Inhalt vonFluent Streams: Eine Bibliothek für die Manipulation umfangreicher Iterables. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Quelle:dev.to
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
Neueste Artikel des Autors
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage