JavaScript陣列和偽陣列
阿新 • • 發佈：2019-09-12
偽陣列和陣列
記住一句話： 偽陣列是一個Object，陣列是Array。
物件和陣列之間的關係
JavaScript的內建函式繼承與 Object.prototype。
可以認為new Array()和[]創建出來的陣列物件， 都擁有Object.prototype屬性值。
var obj = {}; //擁有Object.prototype的屬性值
var arr = []; //由於Array.prototype的屬性繼承自Object.prototype, 那麼它就是擁有兩個屬性
// 即Array.prototype和Object.prototype
注意： 物件沒有陣列的Array.prototype屬性值
什麼是陣列
陣列的基本特徵： 索引(下標)取值
var obj = {};
var array = [];
obj[0] = "L";
array[0] = "L";
console.log(obj); // {0: "L"}
console.log(obj[0]); // L
console.log(array[0]); // L
console.log(obj.length); // undefined
console.log(array.length); // 1
- 陣列取值是根據索引進行獲取值, 而物件是根據鍵值對進行取值
- 物件沒有陣列的特性(索引)，並且obj沒有儲存屬性length，那麼就是未定義，所以undefined
- 對於陣列來講，length是陣列的內建屬性，陣列根據索引長度來更改length
什麼是偽陣列
- 具有length屬性，其他屬性(索引)為非負整數(物件中的索引會被當做字串來處理，這裡你可以當做是個非負整數串來理解)
- 不具有陣列的方法
偽陣列類似於Python中的字典
var fakeArray = {
"0":"胡珺",
"1":23,
length:2
};
for (var i=0;i<fakeArray.length;i++){
console.log(fakeArray[i])
}
常見的偽陣列
- 函式內部的
arguments - DOM物件列表(
document.getElementsByTags) - jQuery物件(
$("div"))
注意： 偽陣列是一個物件
簡單的一個應用
var obj = {
0: 'a',
1: 'b',
2: 'c',
length: 3
}
;[].push.call(obj, 'd');
console.log([].slice.call(obj))
;[].forEach.call(obj, function (num, index) {
console.log(num)
})
差別
- 物件沒有陣列的Array.prototype 的屬性值，型別是 Object ，而陣列型別是 Array
- 陣列是索引，物件是鍵值對
- 使用物件建立偽陣列，偽陣列可以使用部分方法