將HTMLCollection/NodeList/偽數(shù)組轉(zhuǎn)換成數(shù)組的實(shí)現(xiàn)方法
更新時間：2011年06月20日 23:50:42 作者：
將HTMLCollection/NodeList/偽數(shù)組轉(zhuǎn)換成數(shù)組的實(shí)現(xiàn)方法，需要的朋友可以參考下。
這里把符合以下條件的對象稱為偽數(shù)組
1，具有l(wèi)ength屬性
2，按索引方式存儲數(shù)據(jù)
3，不具有數(shù)組的push,pop等方法
如
1，function內(nèi)的arguments 。
2，通過document.forms，F(xiàn)orm.elements，Select.options，document.getElementsByName() ，document.getElementsByTagName() ，childNodes/children 等方式獲取的集合（HTMLCollection，NodeList）等。
3，特殊寫法的對象 ，如
var obj={};
obj[0] = "一";
obj[1] = "二";
obj[2] = "三";
obj.length = 3;
它們不具有數(shù)組的一些方法如push, pop, shift, join等。有時候需要將這些偽數(shù)組轉(zhuǎn)成真正的數(shù)組，這樣可以使用push, pop等方法。以下是工具函數(shù)makeArray
var makeArray = function(obj){
return Array.prototype.slice.call(obj,0);
}
try{
Array.prototype.slice.call(document.documentElement.childNodes, 0)[0].nodeType;
}catch(e){
makeArray = function(obj){
var res = [];
for(var i=0,len=obj.length; i<len; i++){
res.push(obj[i]);
}
return res;
}
}
以下分別測試以上三種偽數(shù)組
//定義一個函數(shù)fun,內(nèi)部使用makeArray將其arguments轉(zhuǎn)換成數(shù)組
function fun(){
var ary = makeArray(arguments);
alert(ary.constructor );
}
//調(diào)用
fun(3,5);
//假設(shè)頁面上有多個段落元素p
var els = document.getElementsByTagName("p");
var ary1 = makeArray(els);
alert(ary1.constructor);
//特殊的js對象（如jquery對象）
var obj={};
obj[0] = "一";
obj[1] = "二";
obj[2] = "三";
obj.length = 3;
var ary2 = makeArray(obj);
alert(ary2.constructor);
1，具有l(wèi)ength屬性
2，按索引方式存儲數(shù)據(jù)
3，不具有數(shù)組的push,pop等方法
如
1，function內(nèi)的arguments 。
2，通過document.forms，F(xiàn)orm.elements，Select.options，document.getElementsByName() ，document.getElementsByTagName() ，childNodes/children 等方式獲取的集合（HTMLCollection，NodeList）等。
3，特殊寫法的對象 ，如
復(fù)制代碼 代碼如下:
var obj={};
obj[0] = "一";
obj[1] = "二";
obj[2] = "三";
obj.length = 3;
它們不具有數(shù)組的一些方法如push, pop, shift, join等。有時候需要將這些偽數(shù)組轉(zhuǎn)成真正的數(shù)組，這樣可以使用push, pop等方法。以下是工具函數(shù)makeArray
復(fù)制代碼 代碼如下:
var makeArray = function(obj){
return Array.prototype.slice.call(obj,0);
}
try{
Array.prototype.slice.call(document.documentElement.childNodes, 0)[0].nodeType;
}catch(e){
makeArray = function(obj){
var res = [];
for(var i=0,len=obj.length; i<len; i++){
res.push(obj[i]);
}
return res;
}
}
以下分別測試以上三種偽數(shù)組
復(fù)制代碼 代碼如下:
//定義一個函數(shù)fun,內(nèi)部使用makeArray將其arguments轉(zhuǎn)換成數(shù)組
function fun(){
var ary = makeArray(arguments);
alert(ary.constructor );
}
//調(diào)用
fun(3,5);
//假設(shè)頁面上有多個段落元素p
var els = document.getElementsByTagName("p");
var ary1 = makeArray(els);
alert(ary1.constructor);
//特殊的js對象（如jquery對象）
var obj={};
obj[0] = "一";
obj[1] = "二";
obj[2] = "三";
obj.length = 3;
var ary2 = makeArray(obj);
alert(ary2.constructor);
相關(guān)文章
JavaScript中利用for循環(huán)遍歷數(shù)組
這篇文章主要為大家詳細(xì)介紹了JavaScript中利用for循環(huán)遍歷數(shù)組，最好不要使用for in遍歷，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-01-01
javascript使用百度地圖api和html5特性獲取瀏覽器位置
本文介紹了javascript使用百度地圖api和html5特性獲取瀏覽器位置的小功能，大家參考使用吧2014-01-01
javascript使用canvas實(shí)現(xiàn)餅狀圖效果
這篇文章主要為大家詳細(xì)介紹了javascript使用canvas實(shí)現(xiàn)餅狀圖效果，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2020-09-09
JavaScript提升性能的常用技巧總結(jié)【經(jīng)典】
這篇文章主要介紹了JavaScript提升性能的常用技巧,結(jié)合實(shí)例形式總結(jié)分析了JavaScript編程中常見的性能提升優(yōu)化技巧,涉及作用域、循環(huán)、變量、DOM及函數(shù)節(jié)流等,非常具有實(shí)用價值,需要的朋友可以參考下2016-06-06
使用js實(shí)現(xiàn)html標(biāo)簽、文本的隱藏、顯示、刪除及添加
在設(shè)計網(wǎng)頁時,有時需要靜態(tài)或動態(tài)地隱藏標(biāo)簽或顯示被隱藏的標(biāo)簽,那該怎么實(shí)現(xiàn)呢?這篇文章主要給大家介紹了關(guān)于使用js實(shí)現(xiàn)html標(biāo)簽、文本的隱藏、顯示、刪除及添加的相關(guān)資料,需要的朋友可以參考下2023-06-06
這篇文章主要為大家詳細(xì)介紹了微信小程序日歷組件的使用方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下2018-12-12
js取float型小數(shù)點(diǎn)后兩位數(shù)的方法
js中取小數(shù)點(diǎn)后兩位方法最常用的就是四舍五入函數(shù)了，前面我介紹過js中四舍五入一此常用函數(shù)，這里正好用上，下面我們一起來看取float型小數(shù)點(diǎn)后兩位一些方法總結(jié)2014-01-01
基于JavaScript將表單序列化類型的數(shù)據(jù)轉(zhuǎn)化成對象的處理（允許對象中包含對象）
這篇文章主要介紹了基于JavaScript將表單序列化類型的數(shù)據(jù)轉(zhuǎn)化成對象的處理（允許對象中包含對象） 的相關(guān)資料,需要的朋友可以參考下2015-12-12
參考：關(guān)于Javascript中實(shí)現(xiàn)暫停的幾篇文章
參考：關(guān)于Javascript中實(shí)現(xiàn)暫停的幾篇文章...2007-03-03
JavaScript實(shí)現(xiàn)驗(yàn)證碼案例
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)驗(yàn)證碼案例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2021-10-10