es-toolkit/fp のdropWhile完全ガイドpipeでつなぐ遅延評価対応の先頭要素除去【免费下载链接】es-toolkitA modern JavaScript utility library thats 2-3 times faster and up to 97% smaller, a major upgrade to lodash.项目地址: https://gitcode.com/GitHub_Trending/es/es-toolkites-toolkit/fpのdropWhileは、述語predicateがtrueを返す間だけ配列の先頭から値を取り除く「データラストdata-last型」の関数を作成する関数です。pipeと組み合わせて使うことで、ネストした呼び出しや一時変数を排除した、上から下へ読める関数型プログラミングのパイプラインを実現します。本記事では、日次ログの前処理やソート済みデータの「先頭のノイズ除去」など、配列の先頭部分を条件付きで切り落とすシーンで使えるこの関数の使い方、pipe内での遅延評価の仕組み、そしてes-toolkit本体の実装コードに基づく動作原理までを詳しく解説します。概要dropWhileが解決する問題dropWhileは「配列の先頭から、条件を満たす限り要素を取り除き、条件が偽になった最初の要素以降を残す」という変換です。条件を満たす要素が「先頭に連続している間だけ」除去される点がポイントで、条件を満たす要素が途中に出現しても影響しません。es-toolkit/fp版のdropWhileは、あらかじめ述語だけを渡して「配列を受け取る関数」を生成しますconst result pipe(array, dropWhile(predicate));このように、es-toolkit/fpの各関数は「設定ここでは述語」を先に受け取り、「データ」を後から受け取るカリー化された形状をしています。pipeがそのデータを供給することで、変換を直列につなげられます。使用方法dropWhileは、パイプされた配列を先頭から見て、predicateがtrueを返す間だけ値を取り除きます。pipeの中では遅延評価lazy evaluationに対応しています。import { dropWhile, pipe } from es-toolkit/fp; pipe( [1, 2, 3, 1], dropWhile(value value 3) ); // [3, 1]この例では、先頭から順に1 3除去、2 3除去、3 3偽 → 除去終了となり、3以降の[3, 1]が結果として返ります。条件を満たさない1が末尾にありますが、先頭の連続部分だけが対象なので影響を受けません。パラメータpredicate((item: T, index: number) boolean)先頭の値を取り除くかどうかを判定する関数です。各要素とそのインデックスを受け取り、trueを返す間は除去が続きます。戻り値((array: readonly T[]) T[])readonly T[]を「先頭から値を取り除いた後の配列」に変換する関数です。つまり、データラスト形式でpipeに渡せるオペレーター関数として機能します。通常コードとの使い分け::: infoパイプラインとして組み合わせない通常のコードでは、元の es-toolkit のdropWhileを使うのがおすすめです。pipeで変換をつなげるときは、このfp版を使用してください。:::es-toolkit/fpはes-toolkit本体の実装を再利用し、呼び出し方をpipeの中に変えただけのものですdocs/fp/intro.md参照。単発の呼び出しなら、データを第一引数に取る通常版が読みやすく、pipeによる変換チェーンではデータラスト形式のfp版が自然です。通常版の使い方は以下の通りですimport { dropWhile } from es-toolkit/array; // 先頭から 3 未満の要素を除去 const numbers [1, 2, 3, 4, 2, 5]; dropWhile(numbers, x x 3); // [3, 4, 2, 5]1 と 2 が除去され、条件が偽になる 3 で停止 // オブジェクト配列に対する条件除去 const users [ { name: Alice, active: false }, { name: Bob, active: false }, { name: Charlie, active: true }, { name: David, active: true }, ]; dropWhile(users, user !user.active); // [{ name: Charlie, active: true }, { name: David, active: true }]なお、配列が空の場合や条件を満たす要素が一つもない場合は、元の配列と同じ内容の新しい配列が返されますdropWhile([1, 2, 3], x x 5)は[1, 2, 3]、dropWhile([], x true)は[]。この仕様はsrc/array/dropWhile.spec.tsのテストでも確認できます。実装の核心eager 経路と lazy 経路の二面性fp版dropWhileの実装src/fp/array/dropWhile.tsは、大きく分けてeager即時評価経路とlazy遅延評価経路の2つを持ち、それらをcombineEagerAndLazyFunctionsで1つの関数に束ねています。export function dropWhileT(predicate: (item: T, index: number) boolean): (array: readonly T[]) T[] { function dropWhileEager(array: readonly T[]): T[] { return dropWhileToolkit(array, (item, index) predicate(item, index)); } const dropWhileLazy (emit: SinkT): SinkT { let dropping true; let index 0; return (value: T): boolean { if (dropping predicate(value, index)) { return true; } dropping false; return emit(value); }; }; return combineEagerAndLazyFunctions(dropWhileEager, dropWhileLazy); }combineEagerAndLazyFunctionssrc/fp/_internal/lazy.tsは、eager 関数にlazyとshortCircuitというメタデータを付与して返します。pipeはこのメタデータを見て、遅延評価の融合fusionを行うかどうかを判断します。eager 経路通常版dropWhileへの委譲単独で呼び出された場合、dropWhileEagerは本体のdropWhileに処理を委譲します。本体の実装は非常にシンプルで、Array.prototype.findIndexとsliceだけで構成されていますexport function dropWhileT( arr: readonly T[], canContinueDropping: (item: T, index: number, arr: readonly T[]) boolean ): T[] { const dropEndIndex arr.findIndex((item, index, arr) !canContinueDropping(item, index, arr)); if (dropEndIndex -1) { return []; } return arr.slice(dropEndIndex); }findIndexで「条件が偽になる最初のインデックス」を探し、そこからsliceするだけです。全要素が条件を満たす場合findIndexが-1は空配列を返します。fp版からは(item, index) predicate(item, index)という形でインデックスをそのまま受け渡すため、述語はインデックス付きで呼び出されます。lazy 経路push 型パイプラインpipeの中で他の遅延対応関数map、filter、takeなどと並んだ場合、dropWhileLazyが使われます。この lazy 経路はジェネレーターではなく**「push 型パイプライン」**で実装されていますsrc/fp/_internal/lazy.tsのコメント参照。dropWhileLazyは下流のSink値を1つ受け取り、実行継続可否をbooleanで返す関数を受け取り、上流向けのSinkを返します。内部状態としてdroppingまだ除去中かとindexを持ち、述語がtrueを返す間は値をemitせずに捨て、初めてfalseになった要素から下流へ流します。dropping predicate(value, index)がtrue値を捨て、trueを返して継続それ以外dropping falseに切り替え、emit(value)の結果下流の継続可否をそのまま返すemitがfalseを返すと例takeが十分な結果を集めた、pipeの駆動ループは即座に停止します。つまり残りの入力要素には一切触れません。pipeによる遅延融合の仕組みpipeは渡された関数群をchunkFunctionsで「遅延関数の連続」と「それ以外」に分割し、遅延関数の連続が配列などの反復可能オブジェクトに対して現れた場合にlazyPipeで融合します。lazyPipeは関数群を逆順最後の関数からで合成し、単一のSinkを作ってから入力を1要素ずつ駆動します。各要素は全ステージを一度に通り抜けるため、ステージ間に中間配列が作られません。この遅延評価が効く具体例として、dropWhileのテストsrc/fp/array/dropWhile.spec.tsでは、map→dropWhile→take(1)のパイプラインでmapのコールバックが3回しか呼ばれないことを検証していますconst spy vi.fn((value: number) value); expect( pipe( [1, 2, 3, 4], map(spy), dropWhile(value value 3), take(1) ) ).toEqual([3]); expect(spy).toHaveBeenCalledTimes(3);入力[1, 2, 3, 4]に対し、dropWhileは3で除去を終えて[3, 4]を下流へ流し、take(1)が3を1つ集めた時点で全体の走査が止まります。4はもちろん、mapのスパイも3回しか呼ばれていないことがポイントです。もし eager な[1,2,3,4].map(...).dropWhile(...).slice(0, 1)であればmapは4回呼ばれ、中間配列も2回生成されます。なお、pipeは遅延融合が効かない場合プリミティブやプレーンオブジェクト、遅延関数でない関数が混ざる場合などは、各関数を順に呼び出す eager なネイティブ配列経路にフォールバックするため、「融合できないから遅くなる」ということはありませんdocs/fp/intro.mdの No tradeoff の項参照。エッジケースと注意点全要素が条件を満たす場合dropWhileは空配列[]を返します本体実装ではfindIndexが-1になるため。テストsrc/array/dropWhile.spec.tsのdropWhile([1, 2, 3], x x 4)が[]になるケースが該当します。条件を満たす要素が先頭にない場合除去は行われず、元の配列のコピーが返されます。空配列述語は一度も呼ばれず、空配列が返されます。述語の副作用lazy 経路では「残りの要素に述語が呼ばれない」ことがあります。副作用のある述語を使う場合は、遅延評価によって呼び出し回数が eager 時と異なる点に注意してください上記テストのスパイ検証がその典型例です。インデックス引数predicateは(item, index)の2引数で呼ばれます。lazy 経路の内部カウンターindexはこのステージ内のゼロ基点インデックスです。性能の観点benchmarks/performance/dropWhile.bench.tsには、es-toolkit本体版・es-toolkit/compat版・lodash 版のdropWhileを比較するベンチマークが用意されています。小さい配列[1.2, 2.3, 3.4]に加えて、長さ 10000 の配列から先頭 5000 要素を除去する大規模ケースも計測対象です。fp版の処理コストは本体実装findIndexsliceに委譲されるため、単発使用時のコストは本体版と同等であり、pipe内で融合された場合は中間配列の削減と早期終了によって入力全体を走査しない恩恵を受けられます。ベンチマークの実行方法はbenchmarks/package.jsonを参照してください。まとめes-toolkit/fpのdropWhileは、pipeによる関数型パイプラインの中で「先頭の連続した不要要素を切り落とす」役割を担うデータラスト関数です。使い方は述語を渡すだけの1ステップで、pipe内では遅延評価により隣接する変換と融合され、中間配列の生成を避けつつ、下流のtakeなどの短絡関数と組み合わせれば入力全体を走査せずに済みます。単発で使う場合は通常版のdropWhileを、変換チェーンの中ではfp版を使う——この使い分けを覚えておけば、可読性と性能の両方を手に入れられます。関連リソースfp 版pipeリファレンス通常版dropWhileリファレンスfp 版dropWhile実装通常版dropWhile実装遅延評価プリミティブSink/combineEagerAndLazyFunctionspipeの実装と遅延融合ロジックfp 版のテスト遅延評価の検証付きfp モジュールの導入ガイド【免费下载链接】es-toolkitA modern JavaScript utility library thats 2-3 times faster and up to 97% smaller, a major upgrade to lodash.项目地址: https://gitcode.com/GitHub_Trending/es/es-toolkit创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考