快捷導(dǎo)航

javascript object array方法使用詳解

更新時(shí)間：2012年12月03日 15:45:24 作者：

在javascript開發(fā)中經(jīng)常會(huì)使用到array中方法，本文將對其一一詳細(xì)介紹，需要了解的朋友可以參考下

Array.prototype.push
push向數(shù)組尾部添加一項(xiàng)并更新length ，返回?cái)?shù)組長度。
如果Object使用push會(huì)怎樣？
看下面代碼, obj好像數(shù)組一樣工作了。length會(huì)自動(dòng)更新。

復(fù)制代碼代碼如下:

 
var push = Array.prototype.push; 
var obj = {}; 
push.call(obj, "hello"); // 返回值 1 
// obj {"0":"hello", length:0} 
push.call(obj, "world"); // 返回值 2 
// obj {"0":"hello", "1":"world",length:2} 

Array.prototype.length Array.prototype.splice
把length和splice 給Object
看下面代碼：obj這貨居然變成數(shù)組了？其實(shí)不然這可能是調(diào)試工具的一些輸出檢查問題。
我們用 instanceof 測試 obj instanceof Array //false
var obj = { length:0, splice:Array.prototype.splice};console.log( obj ); // 打印：[]

繼續(xù)看下面的代碼：
obj.push(0)//返回obj.length
1obj.push(1)//返回obj.length
2obj.splice(0, 1);//刪除第一項(xiàng) 返回刪除項(xiàng)
[0]obj.length // 1 splice刪除一項(xiàng)的時(shí)候同樣更新 length屬性
這樣obj的表現(xiàn)幾乎和array一樣了。不出意外slice,pop,shift,unshift什么的都可以正常工作在object中。
不過如果直接設(shè)置length，在數(shù)組中會(huì)刪除大于length的下表的項(xiàng)，但里的obj并不不會(huì)更新。

應(yīng)用在哪？
jQuery對象表現(xiàn)像一個(gè)array，其實(shí)他是一個(gè)對象。這種對象如何new出來呢？
實(shí)際jQuery把Array的方法借給Object,從而達(dá)到這個(gè)jQuery對象的效果，jQuery對象內(nèi)部也直接使用push等Array的方法。
看看jQuery的部分源碼 (注意加粗)

復(fù)制代碼代碼如下:

 
// Start with an empty selector 
selector: "", 
// The current version of jQuery being used 
jquery: "1.7.1", 
// The default length of a jQuery object is 0 
length: 0, 
...... 
// For internal use only. 
// Behaves like an Array's method, not like a jQuery method. 
push: push, 
sort: [].sort, 
splice: [].splice 

如果你要把Object玩成Array，那么可能潛在的問題length屬性不會(huì)和“數(shù)組”項(xiàng)總和對應(yīng)起來。
所以直接使用length設(shè)置長度不會(huì)得到支持。

看下面jquery代碼，雖然length更新了，jquery的對象并沒更新。（當(dāng)然這并不是jquery的問題）
var jq = $('div') //假設(shè)我們在頁面獲取了40個(gè)
divjq.length // 40
jq.length = 0;jq// ? jq中仍然存放了40個(gè)dom對象 length屬性不會(huì)和“數(shù)組”項(xiàng)總和對應(yīng)起來。
Object使用array的方法還能正常工作，實(shí)在有些意想不到，可能實(shí)際應(yīng)用遠(yuǎn)不止這些。

您可能感興趣的文章: