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 相关文章推荐
tbody元素支持嵌套的注意方法
Mar 24 Javascript
jQuery LigerUI 使用教程表格篇(1)
Jan 18 Javascript
一个基于jquery的文本框记数器
Sep 19 Javascript
PHP开发者必须掌握的6个关键字
Apr 14 Javascript
JS判断网页广告是否被浏览器拦截过滤的代码
Apr 05 Javascript
javascript检测两个数组是否相似
May 19 Javascript
JQuery自动触发事件的方法
Jun 13 Javascript
jQuery获取某天的农历日期并判断是否除夕或新年的方法
Mar 01 Javascript
通过node-mysql搭建Windows+Node.js+MySQL环境的教程
Mar 01 Javascript
又一款js时钟!transform实现时钟效果
Aug 15 Javascript
微信小程序左右滚动公告栏效果代码实例
Sep 16 Javascript
微信小程序实现录音Record功能
May 09 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制作静态网站的模板框架(二)
2006/10/09 PHP
人大复印资料处理程序_补充篇
2006/10/09 PHP
php文件上传的两种实现方法
2016/04/04 PHP
php正则表达式使用方法整理集合
2020/01/31 PHP
Javascript 获取链接(url)参数的方法[正则与截取字符串]
2010/02/09 Javascript
基于jquery实现的一个选择中国大学的弹框 (数据、步骤、代码)
2012/07/26 Javascript
javascript数字时钟示例分享
2014/04/23 Javascript
深入浅出分析javaScript中this用法
2015/05/09 Javascript
原生js获取浏览器窗口及元素宽高常用方法集合
2017/01/18 Javascript
使用Require.js封装原生js轮播图的实现代码
2017/06/15 Javascript
React Native AsyncStorage本地存储工具类
2017/10/24 Javascript
vue中的event bus非父子组件通信解析
2017/10/27 Javascript
vue.js轮播图组件使用方法详解
2018/07/03 Javascript
vue项目中使用Svg的方法
2018/10/24 Javascript
Vue项目History模式404问题解决方法
2018/10/31 Javascript
浅析vue-router实现原理及两种模式
2020/02/11 Javascript
结合axios对项目中的api请求进行封装操作
2020/09/21 Javascript
利用Python和OpenCV库将URL转换为OpenCV格式的方法
2015/03/27 Python
使用Python的Django框架结合jQuery实现AJAX购物车页面
2016/04/11 Python
Python 类与元类的深度挖掘 II【经验】
2016/05/06 Python
Python实现的大数据分析操作系统日志功能示例
2019/02/11 Python
Python实现的银行系统模拟程序完整案例
2019/04/12 Python
CSS3 优势以及网页设计师如何使用CSS3技术
2009/07/29 HTML / CSS
6种非常炫酷的CSS3按钮边框动画特效
2016/03/16 HTML / CSS
html5实现输入框fixed定位在屏幕最底部兼容性
2020/07/03 HTML / CSS
综合办公室个人的自我评价
2013/12/22 职场文书
手工社团活动方案
2014/02/17 职场文书
工商企业管理专业自荐信范文
2014/04/12 职场文书
超市创意活动方案
2014/08/15 职场文书
大学生档案自我鉴定(2篇)
2014/10/14 职场文书
2014年社团工作总结范文
2014/11/27 职场文书
先进典型事迹材料
2014/12/29 职场文书
开票员岗位职责
2015/02/12 职场文书
幼儿园教师读书笔记
2015/06/29 职场文书
2016年教师学习教师法心得体会
2016/01/20 职场文书
Python 中的单分派泛函数你真的了解吗
2021/06/22 Python