在javascript中,對象與數組都是這門語言的原生規范中的基本數據類型,處於並列的位置。
一般來說,如果我們有一個對象obj和一個數組a:
obj["attr1"]; //取obj對象的attr1屬性
a[1]; //取數組a中的第二個元素
但是,有些時候,也會將一個對象“偽裝”成一個數組來用,我們把這種對象稱為“類數組對象”,再此我們可以給它下一個定義,請看如下的代碼:
var a= {};
var i = 0;
for(i=0; i<10 ; i++){
a[i] = i*i;
}
a.length = i;
var total = 0;
for(var j=0; j< a.length; j++){
total += a[j];
}
上述代碼中的a就是一個類數組對象,因此,我們可以在這里給類數組對象下一個定義:任何一個具有length屬性以及對應的非負整數屬性的對象作為一種數組。
但是,類數組對象畢竟本質上是一個Object,而不是真正的Array,那么二者的區別在哪里呢?
1、一個是對象,一個是數組
2、數組的length屬性,當新的元素添加到列表中的時候,其值會自動更新。類數組對象的不會。
3、設置數組的length屬性可以擴展或截斷數組。
4、數組也是Array的實例可以調用Array的方法,比如push,pop等等。
一些個類數組對象的實例:
1、function內部的arguments對象就是一個類數組對象,它用arguments[2]來代表傳入的第3個參數。
2、DOM方法document.getElementsByTagName(),返回的也是一個類數組對象
3、jQuery中的應用: 我們知道可以通過 $('#id')[0]來從jQuery對象獲取原生的dom對象,但是jQuery中是如何實現的呢,$('#id')獲取的jQuery對象到底是一個對象還是一個數組呢,答案是:一個類數組對象
我們看一下jQuery的源代碼:
jQuery = window.jQuery = window.$ = function( selector, context ) {
return new jQuery.fn.init( selector, context );
},
jQuery.fn = jQuery.prototype = {
init: function( selector, context ) {
selector = selector || document;
// Handle $(DOMElement)
if ( selector.nodeType ) {
this[0] = selector;
this.length = 1;
this.context = selector;
return this;
}
...
紅色字部分,構造了一個類數組對象,this指向的是通過jQuery('#id')構造的jQuery對象,而selector就是原生的dom對象,在此,把dom對象存在jQuery對象的0屬性里了(屬性名就叫0)。