|
|
改變自身pop,push,reverse,shift,sort,splice,unshift, 不改變自身concat,join,slice,indexOf,lastIndexOf(后兩個(gè)為1.6),1.6新增的迭代器：map,filter,forEach,every,some,1.8新增reduce,reduceRight
Array 對(duì)象的方法
FF: Firefox, N: NETscape, IE: InterNET Explorer
| 方法 | 描述 | FF | N | IE |
|---|---|---|---|---|
| concat() | 向數(shù)組的副本添加新的元素，返回新的數(shù)組，原數(shù)組不受影響 | 1 | 4 | 4 |
| join() | 把數(shù)組的所有元素放入一個(gè)字符串。元素通過指定的分隔符進(jìn)行分隔。 | 1 | 3 | 4 |
| pop() | 刪除并返回?cái)?shù)組的最后一個(gè)元素 | 1 | 4 | 5.5 |
| push() | 向數(shù)組的末尾添加一個(gè)或更多元素，并返回新的長度。 | 1 | 4 | 5.5 |
| reverse() | 顛倒數(shù)組中元素的順序。 | 1 | 3 | 4 |
| shift() | 刪除并返回?cái)?shù)組的第一個(gè)元素 | 1 | 4 | 5.5 |
| slice() | 從某個(gè)已有的數(shù)組返回選定的元素 | 1 | 4 | 4 |
| sort() | 對(duì)數(shù)組的元素進(jìn)行排序，有一個(gè)可選參數(shù)，為比較函數(shù)。 | 1 | 3 | 4 |
| splice() | 刪除元素，并向數(shù)組添加新元素。 | 1 | 4 | 5.5 |
| toSource() | 代表對(duì)象的源代碼 | 1 | 4 | - |
| toString() | 把數(shù)組轉(zhuǎn)換為字符串，并返回結(jié)果。 | 1 | 3 | 4 |
| toLocaleString() | 把數(shù)組轉(zhuǎn)換為本地?cái)?shù)組，并返回結(jié)果。 | 1 | 3 | 4 |
| unshift() | 向數(shù)組的開頭添加一個(gè)或更多元素，并返回新的長度。 | 1 | 4 | 6 |
| valueOf() | 返回?cái)?shù)組對(duì)象的原始值 | 1 | 2 | 4 |
Array 對(duì)象的屬性
| 方法 | 描述 | FF | N | IE |
|---|---|---|---|---|
| index | 1 | 3 | 4 | |
| input | 在普通的Array中是不具備input屬性的，只有在調(diào)用String對(duì)象的match()方法后返回的數(shù)組才具有input屬性。它是用來存放匹配前的原字符串的內(nèi)容。 | 1 | 3 | 4 |
| length | 設(shè)置或返回?cái)?shù)組中元素的數(shù)目。 | 1 | 2 | 4 |
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
[Ctrl+A 全選 注:如需引入外部Js需刷新才能執(zhí)行]
判斷一個(gè)變量引用的對(duì)象是否為數(shù)組。
復(fù)制代碼 代碼如下:
var isArray = function(a){
return a &&
typeof a === 'object' &&
typeof a.length === 'number' &&
typeof a.splice === 'function' &&
!(a.propertyIsEnumerable('length'));
}
讓數(shù)組具有計(jì)算能力，這個(gè)也很常用，不要用于財(cái)會(huì)的特殊報(bào)表中。
復(fù)制代碼 代碼如下:
Function.prototype.method = function(name,func){
this.prototype[name] = func;
return this;
}
Array.method('reduce',function(fn,value){
for(var i=0,l=this.length;i<l;i++){
value = fn(this[i],value);
}
return value;
});
如何使用，我們可以創(chuàng)建一個(gè)數(shù)字?jǐn)?shù)組與相關(guān)的四則運(yùn)算函數(shù)，把它們代入reduce函數(shù)中就行了
復(fù)制代碼 代碼如下:
var data = [4,8,10,12,16]
var add = function(a,b){
return a+b;
}
var mult = function(a,b){
return a*b;
}
//使用
var sum = data.reduce(add,0)
var product = data.reduce(mult,1);
each方法，讓元素逐個(gè)執(zhí)行傳入的方法。JavaScript 1.6里已經(jīng)實(shí)現(xiàn)了相應(yīng)的forEach方法，但I(xiàn)E不支持，人們搞了個(gè)相近的each方法，在各大類庫都有相應(yīng)的實(shí)現(xiàn)。我們看一個(gè)漂亮的實(shí)現(xiàn)(作者為51JS的客服果果)：
復(fù)制代碼 代碼如下:
Array.prototype.each = function(fn){
for (var i=0;i <this.length;i++)
this[i].constructor==Array?
this[i].each(fn):
fn.call(this[i],i);
};
[1,[2,[3,[4,[5,[6,[7,[8,[9,[0]]]]]]]]]].each(
function(){
return alert(this);
});
上面這個(gè)比較強(qiáng)大，除了能深層遍歷數(shù)組外，還能遍歷類數(shù)組對(duì)象（如arguments,NodeList），對(duì)象的所有屬性都會(huì)被fn方法進(jìn)行調(diào)用。但是從設(shè)計(jì)模式來看，它承擔(dān)職責(zé)太多了.each方法就應(yīng)該是面向數(shù)組，如果是對(duì)象或類數(shù)組對(duì)象，我們應(yīng)該將它們轉(zhuǎn)化為數(shù)組，如JQuery的 makeArray，mootools和Prototype的$A。
復(fù)制代碼 代碼如下:
var arrayize = function(iterable){
try{
return Array.prototype.slice.call(iterable);
}catch(e){
var l = iterable.length || 0, array = new Array(l);
while (l--) array[l] = iterable[l];
return array;
}
}
接著下來我們就可以實(shí)現(xiàn)純數(shù)組的each函數(shù)了。
復(fù)制代碼 代碼如下:
var each = function(func, array) {
for (var i=0,l = array.length; i<l; ++i) {
func(array[i])
}
}
然后再改成一個(gè)原型方法
復(fù)制代碼 代碼如下:
Array.prototype.each = function(func) { each(func,this); };
不過，如果瀏覽器支持Javascript1.6的forEach方法，就用forEach
復(fù)制代碼 代碼如下:
Array.prototype.each = function(func) {
if(Array.prototype.forEach){
this.forEach(func);
}else{
each(func,this);
}
};
用法：
復(fù)制代碼 代碼如下:
[4, 5, 6].each(function(index) { alert(index + "+2 = " + (index+2)); })
火狐官網(wǎng)還有一個(gè)實(shí)現(xiàn):
復(fù)制代碼 代碼如下:
if (!Array.prototype.forEach)
{
Array.prototype.forEach = function(fun /*, thisp*/)
{
var len = this.length >>> 0;
if (typeof fun != "function")
throw new TypeError();
var thisp = arguments[1];
for (var i = 0; i < len; i++)
{
if (i in this)
fun.call(thisp, this[i], i, this);
}
};
}
讓我們看一下jQuery提供的each方法的具體實(shí)現(xiàn)
jQuery.each(obj,fn,arg)
該方法有三個(gè)參數(shù):進(jìn)行操作的對(duì)象obj，進(jìn)行操作的函數(shù)fn，函數(shù)的參數(shù)args。
讓我們根據(jù)ojb對(duì)象進(jìn)行討論：
1.obj對(duì)象是數(shù)組
each方法會(huì)對(duì)數(shù)組中子元素的逐個(gè)進(jìn)行fn函數(shù)調(diào)用，直至調(diào)用某個(gè)子元素返回的結(jié)果為false為止，也就是說，我們可以在提供的fn函數(shù)進(jìn)行處理，使之滿足一定條件后就退出each方法調(diào)用。當(dāng)each方法提供了arg參數(shù)時(shí)，fn函數(shù)調(diào)用傳入的參數(shù)為arg，否則為：子元素索引，子元素本身。
2.obj 對(duì)象不是數(shù)組
該方法同1的最大區(qū)別是：fn方法會(huì)被逐次不考慮返回值的進(jìn)行進(jìn)行。換句話說，obj對(duì)象的所有屬性都會(huì)被fn方法進(jìn)行調(diào)用，即使fn函數(shù)返回false。調(diào)用傳入的參數(shù)同1類似。
復(fù)制代碼 代碼如下:
jQuery.each=function( obj, fn, args ) {
if ( args ) {
if ( obj.length == undefined ){
for ( var i in obj )
fn.apply( obj, args );
}else{
for ( var i = 0, ol = obj.length; i < ol; i++ ) {
if ( fn.apply( obj, args ) === false )
break;
}
}
} else {
if ( obj.length == undefined ) {
for ( var i in obj )
fn.call( obj, i, obj );
}else{
for ( var i = 0, ol = obj.length, val = obj[0]; i < ol && fn.call(val,i,val) !== false; val = obj[++i] ){}
}
}
return obj;
}
需要特別注意的是each方法中fn的具體調(diào)用方法并不是采用簡單的fn(i,val)或fn(args),而是采用了 fn.call(val,i,val)或fn.apply(obj.args)的形式，這意味著，在你自己的fn的實(shí)現(xiàn)中，可以直接采用this指針引用數(shù)組或是對(duì)象的子元素。這種方式是絕大多數(shù)jQuery所采用的一種實(shí)現(xiàn)方式。
復(fù)制代碼 代碼如下:
Array.prototype.contains = function (obj) {
return this.indexOf(obj) != -1;
};
Array.prototype.copy = function (obj) {
return this.concat();
};
Array.prototype.insertAt = function (obj, i) {
this.splice(i, 0, obj);
};
Array.prototype.insertBefore = function (obj, obj2) {
var i = this.indexOf(obj2);
if (i == -1)
this.push(obj);
else
this.splice(i, 0, obj);
};
Array.prototype.removeAt = function (i) {
this.splice(i, 1);
};
Array.prototype.remove = function (obj) {
var i = this.indexOf(obj);
if (i != -1)
this.splice(i, 1);
};
JavaScript技術(shù)：javascript Array對(duì)象使用小結(jié)，轉(zhuǎn)載需保留來源！
鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。
