详解JavaScript中的Array扩展

Java script中的Array扩展，一般都是从对象本身入手。这里我们将介绍一些Array对象中的一些东西，比如indexOf是返回元素在数组的索引，没有则返回-1等等。

最近看了一下developer.mozilla.org里的东西，发现它为Array扩展添加了不少generic method，赶得上Prototype的热心程度。

indexOf

返回元素在数组的索引，没有则返回-1。与string的indexOf方法差不多。

如果其他浏览器没有实现此方法，可以用以下代码实现兼容：

1. Array.prototype.indexOf = function(el, start) {  
   
2.   var startstart = start || 0;   
   
3.   for ( var i=0; i < this.length; ++i ) {   
   
4.       if ( this[i] === el ) {   
   
5.           return i;   
   
6.      }   
   
7.   }   
   
8.   return -1;   
   
9. }; 
   
10. var array = [2, 5, 9];  
    
11. var index = array.indexOf(2);  
    
12. // index is 0  
    
13. index = array.indexOf(7);  
    
14. // index is -1

复制代码

lastIndexOf

与string的lastIndexOf方法差不多。

如果其他浏览器没有实现此方法，可以用以下代码实现兼容：

1. Array.prototype.lastIndexOf = function(el, start) {  
   
2.   var startstart = start || this.length;   
   
3.   if ( start >= this.length ) {   
   
4.       start = this.length;   
   
5.   }   
   
6.  if ( start < 0 ) {   
   
7.        start = this.length + start;   
   
8.   }   
   
9.  for ( var i=start; i >= 0; --i ) {   
   
10.       if ( this[i] === el ) {   
    
11.         return i;   
    
12.     }   
    
13.  }   
    
14.   return -1;   
    
15. };

forEach

各类库中都实现相似的each方法。

如果其他浏览器没有实现此方法，可以用以下代码实现兼容：

1. Array.prototype.forEach = function(fn, thisObj) {  
   
2.   var scope = thisObj || window;   
   
3.   for ( var i=0, j=this.length; i < j; ++i ) {   
   
4.       fn.call(scope, this[i], i, this);   
   
5.  }   
   
6. }; 
   
7. function printElt(element, index, array) {  
   
8.   print("[" + index + "] is " + element); // assumes print is already defined   
   
9. }  
   
10. [2, 5, 9].forEach(printElt);  
    
11. // Prints:  
    
12. // [0] is 2  
    
13. // [1] is 5  
    
14. // [2] is 9

every

如果数组中的每个元素都能通过给定的函数的测试，则返回true，反之false。换言之给定的函数也一定要返回true与false

如果其他浏览器没有实现此方法，可以用以下代码实现兼容：

1. Array.prototype.every = function(fn, thisObj) {  
   
2.  var scope = thisObj || window;   
   
3.   for ( var i=0, j=this.length; i < j; ++i ) {   
   
4.       if ( !fn.call(scope, this[i], i, this) ) {   
   
5.           return false;   
   
6.       }   
   
7.   }   
   
8.   return true;   
   
9. }; 
   
10. function isBigEnough(element, index, array) {  
    
11.  return (element >= 10);   
    
12. }  
    
13. var passed = [12, 5, 8, 130, 44].every(isBigEnough);  
    
14. console.log(passed)  
    
15. // passed is false  
    
16. passed = [12, 54, 18, 130, 44].every(isBigEnough);  
    
17. // passed is true  
    
18. console.log(passed)

some

类似every函数，但只要有一个通过给定函数的测试就返回true。

如果其他浏览器没有实现此方法，可以用以下代码实现兼容：

1. Array.prototype.some = function(fn, thisObj) {  
   
2.   var scope = thisObj || window;   
   
3.   for ( var i=0, j=this.length; i < j; ++i ) {   
   
4.       if ( fn.call(scope, this[i], i, this) ) {   
   
5.           return true;   
   
6.      }   
   
7.   }   
   
8.   return false;   
   
9. }; 
   
10. function isBigEnough(element, index, array) {  
    
11.  return (element >= 10);   
    
12. }  
    
13. var passed = [2, 5, 8, 1, 4].some(isBigEnough);  
    
14. // passed is false  
    
15. passed = [12, 5, 8, 1, 4].some(isBigEnough);  
    
16. // passed is true

filter

把符合条件的元素放到一个新数组中返回。

如果其他浏览器没有实现此方法，可以用以下代码实现兼容：

1. Array.prototype.filter = function(fn, thisObj) {  
   
2.   var scope = thisObj || window;   
   
3.  var a = [];   
   
4.   for ( var i=0, j=this.length; i < j; ++i ) {   
   
5.      if ( !fn.call(scope, this[i], i, this) ) {   
   
6.           continue;   
   
7.      }   
   
8.       a.push(this[i]);   
   
9.   }   
   
10.  return a;   
    
11. }; 
    
12. function isBigEnough(element, index, array) {  
    
13.  return (element <= 10);   
    
14. }  
    
15. var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);

map

让数组中的每一个元素调用给定的函数，然后把得到的结果放到新数组中返回。。

如果其他浏览器没有实现此方法，可以用以下代码实现兼容：

1. Array.prototype.map = function(fn, thisObj) {  
   
2.   var scope = thisObj || window;   
   
3.   var a = [];   
   
4.  for ( var i=0, j=this.length; i < j; ++i ) {   
   
5.      a.push(fn.call(scope, this[i], i, this));   
   
6.   }   
   
7.   return a;   
   
8. }; 
   
9. var numbers = [1, 4, 9];  
   
10. var roots = numbers.map(Math.sqrt);  
    
11. // roots is now [1, 2, 3]  
    
12. // numbers is still [1, 4, 9]

reduce

让数组元素依次调用给定函数，最后返回一个值，换言之给定函数一定要用返回值。

如果其他浏览器没有实现此方法，可以用以下代码实现兼容：

1. Array.prototype.reduce = function(fun /*, initial*/)  
   
2. {  
   
3.  var len = this.length >>> 0;   
   
4. if (typeof fun != "function")  
   
5.   throw new TypeError();   
   
6. if (len == 0 && arguments.length == 1)  
   
7.  throw new TypeError();   
   
8. var i = 0;  
   
9.  if (arguments.length >= 2){   
   
10.   var rv = arguments[1];   
    
11.  } else{   
    
12.  do{   
    
13.    if (i in this){   
    
14.      rv = this[i++];   
    
15.       break;   
    
16.    }   
    
17.   if (++i >= len)   
    
18.       throw new TypeError();   
    
19.  }while (true);   
    
20.  }   
    
21.  for (; i < len; i++){   
    
22.  if (i in this)   
    
23.    rv = fun.call(null, rv, this[i], i, this);   
    
24.  }   
    
25.  return rv;   
    
26. }; 
    
27. var total = [0, 1, 2, 3].reduce(function(a, b){ return a + b; });  
    
28. // total == 6