將 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中文網其他相關文章!