ホームページ > ウェブフロントエンド > jsチュートリアル > Fluent Streams: 豊富なイテラブル操作のためのライブラリ

Fluent Streams: 豊富なイテラブル操作のためのライブラリ

Susan Sarandon
リリース: 2024-12-15 16:24:16
オリジナル
208 人が閲覧しました

Fluent Streams: A Library for Rich Iterables Manipulation

アートワーク: https://code-art.pictures/

次のようなライブラリを想像してください。

  • Ramda と同様に、イテラブル操作に便利な関数を多数提供します
  • 標準の配列反復メソッドなど、使い慣れた読み取り
  • 配列、セット、反復プロトコルなどの JavaScript 組み込みを置き換えようとしません。
  • Java Streams と同様に、「値なし」と「値として定義されていない」を明確に区別するオプションが含まれています
  • バンドルサイズの点でコンパクトです

これらすべてのニーズを満たすものが見つからなかったので、私の小さなライブラリ、fluent-streams を作成しました。

話は安いです。コードを見せて

テキスト内の単語トップ 3

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]
ログイン後にコピー

互いに素な整数

// 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], ...
ログイン後にコピー
  • 示されているように、ストリームは無限になる可能性がありますが、take(n) メソッドを使用して最初の n 項目に制限できます
  • ストリームは、並列であっても複数回再利用できます。これは、ストリームがステートレスであり、入力への参照のみを保存するためです。状態は、ストリームがイテレータを生成するときにのみ作成されます。

カードのデッキを生成する

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

// => 'A♠', '2♠', '3♠', ...
ログイン後にコピー

そしてホールデムポーカーをプレイしましょう!

  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♥']
ログイン後にコピー

最初のプレーヤーはフロップでジャックのペアを持っていますが、2 番目のプレーヤーはストレートを取得しますが、それはリバー上でのみです。誰が勝つでしょうか?

これは安いに違いない

上記のすべては、ネイティブ データ構造のみで実現できます。ただし、Fluent Streams で書かれたコードは読みやすくなります。コードを読みやすくすることは完全に有効な目標ですが、認知負荷、バンドル サイズ、パフォーマンスの観点から、それを達成するためのコストは低くなければなりません。

Fluent Streams もまさにそれです!その理由は次のとおりです:

  • 学習曲線なし: API は標準の Array メソッドに似ており、親しみやすいものです。追加も削除も簡単です。
  • 再発明なし: ライブラリは新しいデータ構造やプロトコルを作成しません。JavaScript のすでに堅牢な機能に基づいて構築されます。
  • バンドルへの影響は最小限: わずか 8.5 KB に縮小されているため、軽量です。プロジェクトにすでに React とそのサテライト ライブラリが含まれており、その重さは数百キロバイトである場合、この追加はほとんど目立ちません。
  • 遅延処理: ライブラリは項目を遅延処理します。これにより、不必要な中間データのコピーが回避され、メモリ使用量が削減され、長いパイプラインの効率が向上します。

注意事項

ライブラリは ES5 に変換されず出荷されます。この決定は、バンドル サイズを小さく維持したいという要望によって決定されました。これは、非常に簡潔なコード (特にジェネレーター) での反復を可能にする ES6 機能を活用することで実現されます。ただし、広くサポートされている言語機能のみが利用されます。

まだ ES5 にトランスパイルしている場合は、ライブラリを自分でトランスパイルしてポリフィルを追加することで使用できます。ただし、これによりバンドルのサイズが増加するため、推奨されないことに注意してください。むしろ、これはビルド構成を見直し、最新の JavaScript 機能を採用する絶好の機会かもしれません。

コーディングを楽しんでください!

以上がFluent Streams: 豊富なイテラブル操作のためのライブラリの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:dev.to
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート