偽數組轉數組方法（原生4種）

偽數組也稱類數組。像arguments 或者 獲取一組元素返回的集合都是偽數組。

偽數組如何轉換成真正數組，其實我們很少去這么做，但是那幫面試官可能會問，並且不止一種方法讓你去實現

方法一、 聲明一個空數組，通過遍歷偽數組把它們重新添加到新的數組中，大家都會，這不是面試官要的

var aLi = document.querySelectorAll('li');
    var arr = [];
    for (var i = 0; i < aLi.length; i++) {
        arr[arr.length] = aLi[i]
    }

方法二、使用數組的slice()方法 它返回的是數組，使用call或者apply指向偽數組 

var arr = Array.prototype.slice.call(aLi);

　模擬一下它的內部實現

　

　方法三 、使用原型繼承

aLi.__proto__ = Array.prototype;

1 . 偽數組是html元素集合，雖然看着好像挺奇怪 ，但是總算轉換成功，不管它。

到這里我使用push() 但是竟然沒有變化也不報錯，第一反應什么情況，方法繼承卻無法使用，不應該啊。試過很多方法都不行，暫時放棄了，

后來我突然想到我push的時候，length增加了啊，為什么看不到，這次我push()更多的內容，竟然出現了，length值和我push進去的length值相同，大概知道是怎么回事了，被html元素遮蔽了。具體什么原因，或許是規范或許是安全考慮 。如果不遮蔽豈不是能修改所以html元素了 ，哈哈

html 元素 
1 var aLi = document.querySelectorAll('li');

    console.log(aLi.constructor === Array) //false
        
    aLi.__proto__ = Array.prototype; 6 
    console.log(aLi.constructor === Array) //true

下圖證明 沒有push的情況下，length = 0（實際應該是4）　　　　　　push()添加了9個，但是前4個被遮蔽。length=9

                                      

 

2 arguments  無影響正常使用，看來只是限制了html對象

function test (){
    arguments.__proto__ = Array.prototype;
    arguments.push(10)
    console.log(arguments)
}
    test(1,2,3,4)

方法4、 ES6中數組的新方法 from()

function test(){
    var arg = Array.from(arguments);
    arg.push(5);
    console.log(arg);//1,2,3,4,5

}
test(1,2,3,4);

方法5 、 順便說下jq的makeArray()，toArray()方法 它們也可以實現偽數組轉數組的功能，但是實現的原理並不太一樣

core_deletedIds = []

core_slice = core_deletedIds.slice,

core_push = core_deletedIds.push,

toArray: 使用了數組的slice方法

makeArray:使用了push方法

 

var aDiv = $('div');
console.log($.isArray(aDiv)); //false
var aDiv = aDiv.toArray(); //實例方法
var aDiv = $.makeArray(aDiv);//靜態方法
console.log($.isArray(aDiv));//true

 

有錯請指出 ，我會及時更正 謝謝。期待更多的方法！