重写数组迭代新方法every,filter,map,some,forEach

原创 2013年12月02日 22:47:08

ECMAScript5中,对数组的操作新增的几种方法。

昨天加了一个every的方法,今天看了看,觉得很二,也很麻烦,今天想了想还是写成这个样子比较简单吧;

本来想要把这五种方法写在一个判断里面,就可以减少if语句的判断,但是又觉得不严谨,所以还是分开写吧。

如下,zylNewArray是一个包含后面数组需要用到的一些重复的方法,都放在这个里面了,这样写,把多个方法放到一个对象里面,可以减少全局的方法吧,貌似会提高一些性能。


var zylNewArray = {
	isFunction:function(func){
		return Object.prototype.toString.call(func) == '[object Function]';
	},
	NotFunctionErrorMessage : function(){
		console.log("first parameter must be a function and this function need three parameter!");
		throw new Error("first parameter must be a function");
	}
}

every和some方法

有返回值。

说起来就是个差不多对立的方法吧,他们都是返回一个布尔值,true,false。

换个大家都熟悉的说法:

every就像是and,只有在数组内的元素,都符合要求,才会返回true,只要有一个不符合,就会返回false;

some就是or,只要有一个是符合的,那么就会返回true,数组的元素,全都不符合条件时,才会返回false;

代码:

if(!Array.prototype.every){
	Array.prototype.every = function(func,context){
		if(zylNewArray.isFunction(func)){
			var that = this,
				i=0,
				len=that.length;
			for(;i<len;i++){
				if(!(func.call(context,that[i],i,that))){
					return false;
				}
			}
			return true;
		}else{
			zylNewArray.NotFunctionErrorMessage();
		}
	}
}
if(!Array.prototype.some){
	Array.prototype.some = function(func,context){
		if(zylNewArray.isFunction(func)){
			var that = this,
				i=0,
				len=that.length;
			for(;i<len;i++){
				if(func.call(context,that[i],i,that)){
					return true;
				}
			}
			return false;
		}else{
			zylNewArray.NotFunctionErrorMessage();
		}
	}
}

使用方法呢,这几个新方法的使用方法,都比较简单,支持两个参数:要在数组每一个元素上运行的函数,和(可选的)运行该函数的作用域。

var result = array.every(function(item,index,array){
	//函数体,写判断条件
	//或者其他需要对每一个数组元素操作的步骤。
},context);
result的返回值,返回是true或者false;

item代表的是,数组中的元素值。

index代表的是,当前的数组元素值,是第几个(跟大家习惯用的a[ i ]中的 i 是一个意思)。

array代表数组a,我觉得是为了嵌套循环使用吧。

这几种方法的第一个参数的输入格式都是上面的样子,更改函数体,就可以实现不同的功能了。


例子:

var a = [1,2,3,4,5];
var b = a.every(function(item,index,array){
	return item > 2;
});
var c = a.some(function(item,index,array){
	return item > 2;
});
其中,b=false,因为数组a中的元素,有小于等于2的,c=true,因为a中的元素,有大于2的。


filter方法

有返回值。

该方法会返回一个新的数组,数组的组成,即是,原数组中,符合条件的数组,不符合条件的被去掉了。

if(!Array.prototype.filter){
	Array.prototype.filter = function(func,context){
		if(zylNewArray.isFunction(func)){
			var that = this,
				i=0,
				len=that.length,
				result = [];
			for(;i<len;i++){
				if(func.call(context,that[i],i,that)){
					result.push(that[i]);
				}
			}
			return result;
		}else{
			zylNewArray.NotFunctionErrorMessage();
		}
	}
}
例子:

var a = [1,2,3,4,5];
var b = a.filter(function(item,index,array){
	return item > 2;
});
//b = [3,4,5]
返回数组中,数组元素值,大于2的所有元素。


map方法

有返回值。

返回一个新的数组,原数组不变。
新的数组是对数组内的元素,进行了处理之后,组成的新的数组。

if(!Array.prototype.map){
	//rewrite map function
	Array.prototype.map = function(func,context){
		if(zylNewArray.isFunction(func)){
			var that = this,
				i=0,
				len=that.length;
			for(;i<len;i++){
				that[i] = func.call(context,that[i],i,that)
			}
			return that;
		}else{
			zylNewArray.NotFunctionErrorMessage();
		}
	}
}

例子:

var a = [1,2,3,4,5];
var b = a.map(function(item,index,array){
	return item * 2;
});
//b = [2,4,6,8,10]


这里是对数组的元素,都做了乘2的处理,并把乘2之后的数组值,构建一个新的数组返回。


forEach方法

没有返回值。

这个是这五种新方法中,唯一一个没有返回值的方法,它的作用类似for循环。

if(!Array.prototype.forEach){
	Array.prototype.forEach = function(func,context){
		if(zylNewArray.isFunction(func)){
			var that = this,
				i=0,
				len=that.length;
			for(;i<len;i++){
				func.call(context,that[i],i,that);
			}
		}else{
			zylNewArray.NotFunctionErrorMessage();
		}
	}
}


例子:

var a = [1,2,3,4,5];
a.forEach(function(item,index,array){
	console.log(item * 2);
});
这个就会打印出一串数据,2,4,6,8,10,可是呢,原数组也没变,又不返回值。


测试了下和for的性能,也都差不多,感觉这个函数怎么这么鸡肋呢,没有啥用啊。

也许是没有看到这个函数的精髓在哪里吧。。。



就这些吧,欢迎交流,欢迎指正!



数组的5中迭代方法 filter()、map()、forEach()、every()、 some()

先来看个牛客网上的题目吧,在数组 arr 中,查找值与 item 相等的元素出现的所有位置 输入例子: findAllOccurrences('abcdefabc'.split(''), 'a')....

Array 的五种迭代方法(every/filter/forEach/map/some)

ES5定义了五个迭代方法,每个方法都接收两个参数:要在每一项上运行的函数和运行该函数的作用域对象(可选的),作用域对象将影响this的值。传入这些方法中的函数会接收三个参数:数组的项的值、该项在数组中...

js数组的迭代器方法(some、every、forEach、map、filter)

//数组操作之迭代器方法(这些方法可以对数组中的每一个元素运用某个方法) //一、不生成新数组的迭代器方法 //1、forEach方法(接收一个函数作为参数) function squ...

js数组的迭代器方法(some、every、forEach、map、filter)

//数组操作之迭代器方法(这些方法可以对数组中的每一个元素运用某个方法) //一、不生成新数组的迭代器方法 //1、forEach方法(接收一个函数作为参数) function squ...

js数组的遍历方法filter()、map()、some()、every()、forEach()、lastIndexOf()、indexOf()

filter():    语法: var filteredArray = array.filter(callback[, thisObject]); ...

JS数组方法总结shift()、unshift()、pop()、push()、concat()、splice()、filter()、map()、some()、every()、forEach()等方法

JS数组方法总结虽然经常使用JS数组的方法,但重来没有真正的全部总结过,这次把编程过程中我常见的数组方法列出来。 shift、 测试数组var array = new Array(1,2,3,4,...

every,some,map,forEach,filter (AS3中Array实用方法,转)

在AS3中,鲜有使用callback的API,本文提供的5个实用方法在项目中的使用频率颇高。 一、案例 设有一个编程辅导班,有学生10人,某次测试成绩如下: var results :Array...

重写数组迭代新方法every

ECMAScript 5给数组定义了5个迭代的方法,每个方法都接收两个参数:要在每一项上运行的函数,和(可选的)运行该函数的作用域对象--影响this的值。 第一个参数的函数需要接收三个参数,数组项的...

JS中some(),every(),forEach(),map(),filter()区别

JS在1.6中为Array新增了几个方法map(),filter(),some(),every(),forEach(),也就是一共有这么多方法了。刚开始接触这些倒也记得不是很清楚,在此纪录一下以加深影...

数组API---EVERY,some,foreach

*****数组API    判断方法:   var bool=arr.every(fun): 用fun依次检查arr中每个元素,是否*都*符合条件     var bool=arr.some(...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:重写数组迭代新方法every,filter,map,some,forEach
举报原因:
原因补充:

(最多只允许输入30个字)