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 相关文章推荐
Jquery 插件学习实例1 插件制作说明与tableUI优化
Apr 02 Javascript
javascript学习笔记(三)显示当时时间的代码
Apr 08 Javascript
在Javascript中 声明时用&quot;var&quot;与不用&quot;var&quot;的区别
Apr 15 Javascript
jQuery中wrapInner()方法用法实例
Jan 16 Javascript
JavaScript学习心得之概述
Jan 20 Javascript
浅谈JS中逗号运算符的用法
Jun 12 Javascript
JS中的数组方法笔记整理
Jul 26 Javascript
AngularJS教程之MVC体系结构详解
Aug 16 Javascript
BootStrap Table 获取同行不同列元素的方法
Dec 19 Javascript
Jquery把获取到的input值转换成json
May 15 jQuery
vue多页面开发和打包正确处理方法
Apr 20 Javascript
解决antd 下拉框 input [defaultValue] 的值的问题
Oct 31 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
《神奇女侠:血脉》神力女超人大战犯罪公司
2020/04/09 欧美动漫
色色整理的PHP面试题集锦
2012/03/08 PHP
使用 PHPMAILER 发送邮件实例应用
2012/11/07 PHP
php处理文件的小例子(解压缩,删除目录)
2013/02/03 PHP
destoon实现资讯信息前面调用它所属分类的方法
2014/07/15 PHP
php实现分页显示
2015/11/03 PHP
简介WordPress中用于获取首页和站点链接的PHP函数
2015/12/17 PHP
ThinkPHP3.2.2实现持久登录(记住我)功能的方法
2016/05/16 PHP
PHP单例模式与工厂模式详解
2017/08/29 PHP
如何解决PHP获取不到SESSION信息之一般情况
2019/10/10 PHP
TNC vs IO BO3 第一场2.13
2021/03/10 DOTA
Nigma vs Alliance BO5 第一场2.14
2021/03/10 DOTA
密码框显示提示文字jquery示例
2013/08/29 Javascript
jQuery 过滤方法filter()选择具有特殊属性的元素
2014/06/15 Javascript
javascript中局部变量和全局变量的区别详解
2015/02/27 Javascript
深入理解关于javascript中apply()和call()方法的区别
2016/04/12 Javascript
15个值得开发人员关注的jQuery开发技巧和心得总结【经典收藏】
2016/05/25 Javascript
关于Javascript中defer和async的区别总结
2016/09/20 Javascript
js中arguments对象的深入理解
2019/05/14 Javascript
JavaScript使用面向对象实现的拖拽功能详解
2019/06/12 Javascript
简单了解JS打开url的方法
2020/02/21 Javascript
pyspark.sql.DataFrame与pandas.DataFrame之间的相互转换实例
2018/08/02 Python
详解python定时简单爬取网页新闻存入数据库并发送邮件
2020/11/27 Python
python matplotlib工具栏源码探析三之添加、删除自定义工具项的案例详解
2021/02/25 Python
CSS3 Columns分列式布局方法简介
2014/05/03 HTML / CSS
css 元素选择器的简单实例
2016/05/23 HTML / CSS
加拿大领先的时尚和体育零售商:Sporting Life
2019/12/15 全球购物
为什么group by 和order by会使查询变慢
2014/05/16 面试题
2014信息技术专业毕业生自我评价
2014/01/17 职场文书
写给学生的新学期寄语
2014/01/18 职场文书
给水工程专业毕业生自荐信
2014/01/28 职场文书
房地产财务管理制度
2014/02/02 职场文书
2015年幼儿园大班工作总结
2015/04/25 职场文书
2016年清明节网上祭英烈活动总结
2016/04/01 职场文书
导游词幽默开场白
2019/06/26 职场文书
python编程学习使用管道Pipe编写优化代码
2021/11/20 Python