首頁 > web前端 > js教程 > 主體

如何有效率地將 HTMLCollection 轉換為陣列?

DDD
發布: 2024-11-20 03:13:01
原創
876 人瀏覽過

How to Efficiently Convert an HTMLCollection to an Array?

有效的 HTMLCollection 到陣列的轉換

將 HTMLCollection 轉換為陣列可以透過迭代方式實現,手動將每個項目附加到陣列中。然而,有更有效的方法來進行這種轉換。

原生程式碼方法:

其中一個方法是利用 slice方法>Array.prototype,如以下程式碼片段所示:

var arr = Array.prototype.slice.call(htmlCollection);
登入後複製
該方法有效地模擬了迭代迭代的功能,提供了一種高效的轉換手段。

簡明版本:

為了更簡潔,下面的表達式達到相同的結果:

var arr = [].slice.call(htmlCollection);
登入後複製

Array.from ( ES6 ):

在ECMAScript 2015在及更高版本中,

Array.from 方法提供了將可迭代物件轉換為陣列的本機解決方案,包括HTMLCollections:

var arr = Array.from(htmlCollection);
登入後複製

Spread 運算子( ES6 ):

ES6 中引入的展開運算符,提供了與

Array.from 功能等效的方法,如下圖:

var arr = [...htmlCollection];
登入後複製

效能比較:

這些方法的比較分析,請參考以下基準:http://jsben.ch/h2IFA

以上是如何有效率地將 HTMLCollection 轉換為陣列?的詳細內容。更多資訊請關注PHP中文網其他相關文章!

來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板