JavaScript中的類數組對象


    在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)。


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM