ES6でノードリストをフィルタリングまたはマップする最も効率的な方法は何ですか?
測定値に基づいて、次のオプションのいずれかを使用します。
[...nodelist].filter
または
Array.from(nodelist).filter
どちらをお勧めしますか?また、たとえば配列を使用しないより良い方法はありますか?
[...nodelist]
は、オブジェクトが反復可能な場合、オブジェクトの配列を作成します。Array.from(nodelist)
は、オブジェクトが反復可能な場合はオブジェクトから配列を作成しますまたはオブジェクトが配列に似ている場合(.length
および数値小道具)NodeList.prototype[Symbol.iterator]
が存在する場合、2つの例はイテラブルをカバーするため、2つの例は同一です。ただし、NodeList
が反復可能なように環境が構成されていない場合、最初の例は失敗し、2番目の例は成功します。 Babel
現在 このケースを適切に処理しない 。
したがって、NodeList
が反復可能である場合、使用するのはあなた次第です。私はケースバイケースで選択するでしょう。 Array.from
の利点の1つは、マッピング関数の2番目の引数を取ることです。一方、最初の[...iterable].map(item => item)
は一時配列を作成する必要があり、Array.from(iterable, item => item)
は必要ありません。ただし、リストをマッピングしていない場合は重要ではありません。
TL; DR;
Array.prototype.slice.call(nodelist).filter
Slice()メソッドは配列を返します。返される配列は、コレクション(NodeList)の浅いコピーですしたがって、** Array.from()**よりも高速に動作します
元のコレクションの要素は、次のように返された配列にコピーされます。
引数に関する簡単な説明
Array.prototype.slice(beginIndex、endIndex)
Array.prototype.slice.call(namespace、beginIndex、endIndex)
NodeListでmap
を直接使用する reference を見つけました。
Array.prototype.map.call(nodelist, fn)
私はそれをテストしていませんが、NodeListに直接アクセスする必要があるため、これが高速になると考えられます。