chrome原生方法之数组

 更新时间:2011年11月30日 21:39:50   作者:  
由于各浏览器的js实现不同,因此各浏览器的原生对象(这里不涉及DOM实现,当然这也有区别)的原生方法也不尽相同,采用原生方法的好处显而易见,使用兼有效率,而且其中有些方法可能包含在以后的ECMAscript规范中
下面看一下chrome/15实现的一些数组方法
---------------------------------------------------------------------------------------------
concat:这个好说,唯一需要注意的就是concat不是就地修改的,是指返回链接后的结果,另外一点是指回展开第一层数组
join:连接数组
pop:出栈操作,注意这个也是就地修改原数组
push: 入栈操作,注意这个也是就地修改原数组
reverse: 倒序数组,注意这个也是就地修改原数组
shift: 出队操作,注意这个也是就地修改原数组
unshift: 在数组头部插入一项,后面的以此后移
slice: 截取数组的一部分,里一个常见的操作是用这个方法把类数组转化为真正的数组
splice:修改数组,可以用来插入新项,注意这个也是就地修改原数组
sort: 数组排序,注意这个也是就地修改原数组
toLocaleString:返回数组的本地字符串形式,一般是用逗号
toString: 返回数组的字符串形式,一般是用逗号
---------------------------------------------------------------------------------------------
isArray:判断一个变量是不是数组,注意,这个是个静态方法,调用形式Array.isArray()
---------------------------------------------------------------------------------------------
every:判断一个数组里面的项是不是都满足条件,如果全部满足条件,返回true,否则返回false
some: 这个可以跟every联系起来,every要求全部为true最后才为true,some只要有一项为true,返回就为true
filter:按照给定条件从数组里筛选出符合条件的项,然后作为新的数组返回,否则返回null
forEach:对数组中的每一项一次执行给定的操作
indexOf:返回给定项在数组中的第一个位置(从0下标开始)
lastIndexOf:与indexOf相反
map:对数组中的每一项一次执行给定的操作并返回修改后的数组
reduce:reduce(func,init) func为二元函数,将func作用于seq序列的元素,每次携带一对(先前的结果以及下一个序列的元素),连续的将现有的结果和下一个值作用在获得的随后的结果上,最后减少我们的序列为一个单一的返回值。
reduceRight:reduce从右往左的实现
---------------------------------------------------------------------------------------------
当我们实现自己的小型库或者一些工具时,也可以稍微扩展一下
复制代码 代码如下:

Object.prototype.extend = function(src){
for(var i in src){
this[i] = src[i];
}
}
Array.extend({
toArray : function(arrayLike){
try{
return [].slice.call(arrayLike);
}catch(ex){
var ret = [];
for(var i = 0,len = arrayLike.length ; i < len ; i++){
ret.push(arrayLike[i]);
}
}
},
isArray : (Array.isArray)?Array.isArray:function(ele){
return ele.constructor == Array;
}
})
Array.prototype.extend((function(){
var each = Array.prototype.forEach || function(fn,obj){
for(var i = 0,len = this.length ; i < len ; i++){
fn.call(obj,this[i]);
}
};
var filter = Array.prototype.filter || function(fn,obj){
var result = [];
for(var i = 0,len = this.length ; i < len ; i++){
if(fn.call(obj,this[i])){
result.push(this[i]);
}
}
return result;
};
var every = Array.prototype.every || function(fn,obj){
for(var i = 0,len = this.length ; i < len ; i++){
if(!fn.call(obj,this[i])){
return false;
}
}
return true;
};
var some = Array.prototype.some || function(fn,obj){
for(var i = 0,len = this.length ; i < len ; i++){
if(fn.call(obj,this[i])){
return true;
}
}
return false;
};
var indexOf = Array.prototype.indexOf || function(dest){
for(var i = 0; i < this.length ;i++){
if(dest == this[i]){
return i;
}
}
return -1;
};
var map = Array.prototype.map || function(fn,obj){
var result = [];
for(var i = 0,len = this.length ; i < len ; i++){
result.push(fn.call(obj,this[i]));
}
return result;
};
var reduce =Array.prototype.reduce || function(fn,init){
var result = init || this[0];
for(var i = 0; i < this.length; i++){
result = fn(result,this[i]);
}
return result;
}
return {
map : map,
each : each,
some : some,
every : every,
filter : filter,
indexOf: indexOf,
reduce : reduce
}
})())

下面是一个小例子,给指定ul下面的li设置内容:
复制代码 代码如下:

<ul id="test">
<li></li>
<li></li>
<li></li>
</ul>
<script type="text/javascript">
Array.prototype.slice.call(document.getElementById('test').getElementsByTagName('li'),0).each(function(li){
li.innerHTML = '测试each';
})
</script>

相关文章

  • JavaScript中this绑定规则你理解了吗

    JavaScript中this绑定规则你理解了吗

    JavaScript中的this是一个非常重要的概念,也是一个令新手开发者甚至有些不深入理解的多年经验开发者都会感到困惑的概念,如果你希望自己能够使用this编写更好的代码或者更好理解他人的代码,就跟随小编一起理解一下this吧
    2023-07-07
  • js面向对象之静态方法和静态属性实例分析

    js面向对象之静态方法和静态属性实例分析

    这篇文章主要介绍了js面向对象之静态方法和静态属性,实例分析了静态方法和静态属性的原理及应用,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-01-01
  • JavaScript 不支持 indexof 该如何解决

    JavaScript 不支持 indexof 该如何解决

    indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。本文给大家介绍ie8 不支持 indexof 的解决方法
    2016-03-03
  • JS中字符串切割为数组/数组拼接为字符串的代码例子

    JS中字符串切割为数组/数组拼接为字符串的代码例子

    这篇文章主要给大家介绍了关于JS中字符串切割为数组/数组拼接为字符串的相关资料,数组是JavaScript中最强大的数据结构,我们常常通过将字符串转换为数组来解决许多算法,需要的朋友可以参考下
    2023-09-09
  • JavaScript 错误捕获与处理的完整指南

    JavaScript 错误捕获与处理的完整指南

    在JavaScript中捕获错误通常有四种方式,try-catch 语句块,Promise 的 catch 方法,throw 语句以及window.onerror事件处理程序,并通过代码示例给大家讲解的非常详细,需要的朋友可以参考下
    2024-02-02
  • JS中from 表单序列化提交的代码

    JS中from 表单序列化提交的代码

    这篇文章主要介绍了javascript中from 表单序列化提交的实现方法,代码简单易懂,非常不错,需要的朋友参考下吧
    2017-01-01
  • JavaScript可视化与Echarts详细介绍

    JavaScript可视化与Echarts详细介绍

    提到数据可视化相信大家都不陌生,它能够将单一的数据通过合适的可视化图表类型表现出来,使其更加直观的展现数据的变化趋势、对比、峰值等等。其实在前端开发中,数据可视化也尤为重要,在众多图表库中,echarts就是最常见的图表库之一
    2022-07-07
  • 原生JS实现跑马灯效果

    原生JS实现跑马灯效果

    本文主要分享了原生JS实现跑马灯效果的示例代码。具有很好的参考价值,下面跟着小编一起来看下吧
    2017-02-02
  • 微信小程序中使用ECharts 异步加载数据实现图表功能

    微信小程序中使用ECharts 异步加载数据实现图表功能

    本文通过实例代码给大家介绍了微信小程序中使用ECharts 异步加载数据实现图表功能,代码简单易懂,非常不错,具有一定的参考借鉴价值,需要的朋友参考下吧
    2018-07-07
  • 一览画面点击复选框后获取多个id值的方法

    一览画面点击复选框后获取多个id值的方法

    这篇文章主要介绍了在一览画面点击复选框后获取多个id值的方法,前台采用js技术后台采用java技术实现的,逻辑清晰,非常不错,具有参考借鉴价值,感兴趣的朋友一起看看吧
    2016-05-05

最新评论