首頁 > web前端 > js教程 > 主體

關於js類別數組的介紹

不言
發布: 2018-07-20 15:49:30
原創
1403 人瀏覽過

js類別數組(ArrayLike)是什麼? js類別數組就是擁有length屬性,其它屬性(索引)為非負整數(物件中的索引會被當做字串來處理,這裡你可以當做是個非負整數字串來理解);不具有數組所具有的方法。

範例:

//类数组示例
var a = {'1':'gg','2':'love','4':'meimei',length:5};
Array.prototype.join.call(a,'+');//'+gg+love++meimei'//非类数组示例
var c = {'1':2};   //没有length属性就不是类数组
登入後複製

javascript中常見的類別數組有arguments物件和DOM方法的回傳結果。
例如 document.getElementsByTagName()。

1. 判斷一個物件是否是類別數組

function isArrayLike(o) {    
if (o &&                                // o is not null, undefined, etc.
        typeof o === 'object' &&            // o is an object
        isFinite(o.length) &&               // o.length is a finite number
        o.length >= 0 &&                    // o.length is non-negative
        o.length===Math.floor(o.length) &&  // o.length is an integer
        o.length < 4294967296)              // o.length < 2^32
        return true;                        // Then o is array-like
    else
        return false;                       // Otherwise it is not}
登入後複製

2. js類別數組轉為數組之後進行操作有什麼優勢

由於類別數組不具有數組所具有的操作數組的方法,講類數組轉換為數組之後就能調用如shift,unshift,splice,slice,concat,reverse,sort等這些強大的方法,方便快捷。

3. js類別陣列轉為陣列方法

Array.prototype.slice.call(arrayLike)
登入後複製
//将arguments转化为数组后,截取第一个元素之后的所有元素
  var args = Array.prototype.slice.call(arguments,1);
登入後複製

首先Array.prototype.slice.call(arrayLike)的結果是將arrayLike物件轉換成Array物件。所以其後面可以直接呼叫數組所具有的方法,例如

Array.prototype.slice.call(arrayLike).forEach(function(element,index){  //可以随意操作每一个element了 })
登入後複製

(1)Array.prototype.slice表示陣列的原型中的slice方法。注意這個slice方法回傳的是一個Array類型的物件。

//slice的内部实现Array.prototype.slice = function(start,end){  
      var result = new Array();  
      start = start || 0;  
      end = end || this.length; //this指向调用的对象,当用了call后,能够改变this的指向,也就是指向传进来的对象,这是关键  
      for(var i = start; i < end; i++){  
           result.push(this[i]);  
      }  
      return result;  
 }
登入後複製

(2)能呼叫call的只有方法,所以不能用[].call這種形式,得用[].slice。而call的第一個參數表示真正呼叫slice的環境變成了arrayLike物件。所以就好像arrayLike也有了陣列的方法。

(3)附上js類別陣列轉為陣列的通用函數

var toArray = function(s){  
    try{  
        return Array.prototype.slice.call(s);  
    } catch(e){  
            var arr = [];  
            for(var i = 0,len = s.length; i < len; i++){  
                //arr.push(s[i]);  
                 arr[i] = s[i];     //据说这样比push快            }  
             return arr;  
    }
登入後複製

4. 將陣列轉換為參數列表(類別陣列)

呼叫apply方法的時候,第一個參數是物件(this), 第二個參數是一個陣列集合,   這裡就說明apply的一個巧妙用法,可以將一個陣列預設的轉換為一個參數列表([param1,param2,param3 ] 轉換為 param1,param2,param3), 這個如果讓我們用程式來實現將數組的每一個項,來轉換為參數的列表,可能都得費一會功夫,借助apply的這點特性,所以就有了以下高效率的方法。

相關建議:

js基礎陣列的概述 陣列的長度 陣列的遍歷

以上是關於js類別數組的介紹的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
作者最新文章
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!