JavaScript Array扩展实现代码


Posted in Javascript onOctober 14, 2009

indexOf
返回元素在数组的索引,没有则返回-1。与string的indexOf方法差不多。
如果其他浏览器没有实现此方法,可以用以下代码实现兼容:

Array.prototype.indexOf = function(el, start) { 
    var start = start || 0; 
    for ( var i=0; i < this.length; ++i ) { 
        if ( this[i] === el ) { 
            return i; 
        } 
    } 
    return -1; 
}; 
var array = [2, 5, 9]; 
var index = array.indexOf(2); 
// index is 0 
index = array.indexOf(7); 
// index is -1

lastIndexOf
与string的lastIndexOf方法差不多。
如果其他浏览器没有实现此方法,可以用以下代码实现兼容:
Array.prototype.indexOf = function(el, start) { 
    var start = start || 0; 
    for ( var i=0; i < this.length; ++i ) { 
        if ( this[i] === el ) { 
            return i; 
        } 
    } 
    return -1; 
};

forEach
各类库中都实现相似的each方法。
如果其他浏览器没有实现此方法,可以用以下代码实现兼容:
Array.prototype.forEach = function(fn, thisObj) { 
    var scope = thisObj || window; 
    for ( var i=0, j=this.length; i < j; ++i ) { 
        fn.call(scope, this[i], i, this); 
    } 
}; 
function printElt(element, index, array) { 
    print("[" + index + "] is " + element); // assumes print is already defined 
} 
[2, 5, 9].forEach(printElt); 
// Prints: 
// [0] is 2 
// [1] is 5 
// [2] is 9

every
如果数组中的每个元素都能通过给定的函数的测试,则返回true,反之false。换言之给定的函数也一定要返回true与false
如果其他浏览器没有实现此方法,可以用以下代码实现兼容:
Array.prototype.every = function(fn, thisObj) { 
    var scope = thisObj || window; 
    for ( var i=0, j=this.length; i < j; ++i ) { 
        if ( !fn.call(scope, this[i], i, this) ) { 
            return false; 
        } 
    } 
    return true; 
}; 
function isBigEnough(element, index, array) { 
  return (element <= 10); 
} 
var passed = [12, 5, 8, 130, 44].every(isBigEnough); 
// passed is false 
passed = [12, 54, 18, 130, 44].every(isBigEnough); 
// passed is true

some
类似every函数,但只要有一个通过给定函数的测试就返回true。
如果其他浏览器没有实现此方法,可以用以下代码实现兼容:
Array.prototype.some = function(fn, thisObj) { 
    var scope = thisObj || window; 
    for ( var i=0, j=this.length; i < j; ++i ) { 
        if ( fn.call(scope, this[i], i, this) ) { 
            return true; 
        } 
    } 
    return false; 
}; 
function isBigEnough(element, index, array) { 
  return (element >= 10); 
} 
var passed = [2, 5, 8, 1, 4].some(isBigEnough); 
// passed is false 
passed = [12, 5, 8, 1, 4].some(isBigEnough); 
// passed is true

filter
把符合条件的元素放到一个新数组中返回。
如果其他浏览器没有实现此方法,可以用以下代码实现兼容:
Array.prototype.filter = function(fn, thisObj) { 
    var scope = thisObj || window; 
    var a = []; 
    for ( var i=0, j=this.length; i < j; ++i ) { 
        if ( !fn.call(scope, this[i], i, this) ) { 
            continue; 
        } 
        a.push(this[i]); 
    } 
    return a; 
}; 
function isBigEnough(element, index, array) { 
  return (element <= 10); 
} 
var filtered = [12, 5, 8, 130, 44].filter(isBigEnough);

map
让数组中的每一个元素调用给定的函数,然后把得到的结果放到新数组中返回。。
如果其他浏览器没有实现此方法,可以用以下代码实现兼容:
Array.prototype.map = function(fn, thisObj) { 
    var scope = thisObj || window; 
    var a = []; 
    for ( var i=0, j=this.length; i < j; ++i ) { 
        a.push(fn.call(scope, this[i], i, this)); 
    } 
    return a; 
}; 
<div id="highlighter_240589"> 
var numbers = [1, 4, 9]; 
var roots = numbers.map(Math.sqrt); 
// roots is now [1, 2, 3] 
// numbers is still [1, 4, 9]

reduce
让数组元素依次调用给定函数,最后返回一个值,换言之给定函数一定要用返回值。
如果其他浏览器没有实现此方法,可以用以下代码实现兼容:
Array.prototype.reduce = function(fun /*, initial*/) 
{ 
  var len = this.length >>> 0; 
  if (typeof fun != "function") 
    throw new TypeError(); 
  if (len == 0 && arguments.length == 1) 
    throw new TypeError(); 
  var i = 0; 
  if (arguments.length >= 2){ 
    var rv = arguments[1]; 
  } else{ 
    do{ 
      if (i in this){ 
        rv = this[i++]; 
        break; 
      } 
      if (++i >= len) 
        throw new TypeError(); 
    }while (true); 
  }   for (; i < len; i++){ 
    if (i in this) 
      rv = fun.call(null, rv, this[i], i, this); 
  } 
  return rv; 
};

var total = [0, 1, 2, 3].reduce(function(a, b){ return a + b; }); 
// total == 6
Javascript 相关文章推荐
更正确的asp冒泡排序
May 24 Javascript
GWT中复制到剪贴板 js+flash实现复制 兼容性比较好
Mar 07 Javascript
js跨域访问示例(客户端/服务端)
May 19 Javascript
JavaScript动态修改弹出窗口大小的方法
Apr 06 Javascript
JS+CSS实现下拉列表框美化效果(3款)
Aug 15 Javascript
JS实现登录页面记住密码和enter键登录方法推荐
May 10 Javascript
JavaScript的ExtJS框架中数面板TreePanel的使用实例解析
May 21 Javascript
JavaScript事件学习小结(一)事件流
Jun 09 Javascript
jQuery的ready方法实现原理分析
Oct 26 Javascript
vue2.0中goods选购栏滚动算法的实现代码
May 17 Javascript
React Native之TextInput组件解析示例
Aug 22 Javascript
10分钟上手vue-cli 3.0 入门介绍
Apr 04 Javascript
JavaScript 动态创建VML的方法
Oct 14 #Javascript
JavaScript读取中文cookie时的乱码问题的解决方法
Oct 14 #Javascript
jQuery 标题的自动翻转实现代码
Oct 14 #Javascript
JavaScript 替换Html标签实现代码
Oct 14 #Javascript
JavaScript null和undefined区别分析
Oct 14 #Javascript
JavaScript iframe的相互操作浅析
Oct 14 #Javascript
使用jQuery简化Ajax开发 Ajax开发入门
Oct 14 #Javascript
You might like
php mysql Errcode: 28 终极解决方法
2009/07/01 PHP
php实现的遍历文件夹下所有文件,编辑删除
2010/01/05 PHP
PHP性能优化准备篇图解PEAR安装
2011/12/05 PHP
PHP APC缓存配置、使用详解
2014/03/06 PHP
php获取CSS文件中图片地址并下载到本地的方法
2014/12/02 PHP
jQuery获取json后使用zy_tmpl生成下拉菜单
2015/03/27 PHP
PHP中$_SERVER使用说明
2015/07/05 PHP
thinkphp整合系列之极验滑动验证码geetest功能
2019/06/18 PHP
表单提交验证类
2006/07/14 Javascript
combox改进版 页面原型参考dojo的,比网上jQuery的那些combox功能强,代码更小
2010/04/15 Javascript
javascript 日期时间 转换的方法
2013/02/21 Javascript
原生js ActiveXObject获取execl里面的值
2013/11/01 Javascript
JavaScript中this的使用详解
2013/11/08 Javascript
javascript对下拉列表框(select)的操作实例讲解
2013/11/29 Javascript
jQuery判断元素是否存在的可靠方法
2014/05/06 Javascript
JS获得选取checkbox整行数据的方法
2015/01/28 Javascript
jQuery简单实现input文本框内灰色提示文本效果的方法
2015/12/02 Javascript
原生javascript实现解析XML文档与字符串
2016/03/01 Javascript
微信小程序开发探究
2016/12/27 Javascript
JavaScript 详解预编译原理
2017/01/22 Javascript
基于vuejs实现一个todolist项目
2017/04/11 Javascript
纯JS实现图片验证码功能并兼容IE6-8(推荐)
2017/04/19 Javascript
微信小程序学习笔记之本地数据缓存功能详解
2019/03/29 Javascript
深入浅出vue图片路径的实现
2019/09/04 Javascript
es6中reduce的基本使用方法
2019/09/10 Javascript
django简单的前后端分离的数据传输实例 axios
2020/05/18 Javascript
一起来了解一下JavaScript的预编译(小结)
2021/03/01 Javascript
centos6.7安装python2.7.11的具体方法
2017/01/16 Python
Python在for循环中更改list值的方法【推荐】
2018/08/17 Python
python logging设置level失败的解决方法
2020/02/19 Python
Python实现JS解密并爬取某音漫客网站
2020/10/23 Python
HTML 5 标签、属性、事件及浏览器兼容性速查表 附打包下载
2012/10/20 HTML / CSS
全球地下的服装和态度:Slam Jam
2018/02/04 全球购物
2014年助理政工师工作总结
2014/12/19 职场文书
公司人力资源管理制度
2015/08/05 职场文书
《称赞》教学反思
2016/02/17 职场文书