ES5新增数组方法的实现

最新推荐文章于 2022-06-04 15:42:48 发布
最新推荐文章于 2022-06-04 15:42:48 发布
阅读量263 收藏
点赞数 2
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37635519/article/details/89945958
版权

1. forEach：

<!DOCTYPE html>
 <html>
 <head>
 	<meta charset="utf-8">
 	<meta http-equiv="X-UA-Compatible" content="IE=edge">
 	<title></title>
 	<link rel="stylesheet" href="">
 </head>
 <body>
 	<!-- //数组扩展
	//1.forEach  2.Filter  3.Map  4.Every  5.Some  6.Reduce  7.ReduceRight -->
 	<script>

 		var arr=
 		[ {name:"ww",age:12},
 		  {name:"qq",age:13},
 		  {name:"yy",age:14},
 		  {name:"kk",age:15}
 		]
        var obj={name:"www"}
        var obj={name:"www"}

 	
//原型链上写自己的myForEach方法
 		Array.prototype.myForEach=function(func){
 			var _self=this;

 			for(var i=0;i<_self.length;i++){
 				 
 				func.apply(arguments[1]||window,[_self[i],i,_self])
 			}


 		}
 		arr.myForEach(function(ele,index,self){
 			console.log(ele,this);
 		},obj)
//可传两个参数，第二个为第一个参数里的this指向

2.filter

Array.prototype.myFilter=function(func){
			var _self=this;
 			var len=_self.length;
 			var newArr=[];		
 			for(var i=0;i<len;i++){
				if(func.apply(arguments[1]||window,[_self[i],i,_self])){
					newArr.push(_self[i]);
				}
				
			}
			return newArr;
		}

		// var newArr=arr.myFilter(function(ele,index,self){
		// 	return ele.age>14;
		// },obj)
		// console.log(newArr)

3.map

	Array.prototype.myMap=function(func){
			var _self=this;
 			var len=_self.length;
 			var newArr=[];	
 			for(var i=0;i<len;i++){
 				newArr.push(clone(func.apply(arguments[1]||window,[_self[i],i,_self])));//优化--clone深度克隆（原方法没有）
 			}
 			return newArr;
		}




		// var newArr=arr.myMap(function(ele,index,self){
		// 	ele.age+=ele.age;//如果ele是引用值修改会影响原数组

		// 	return ele;
		// },obj)

		// console.log(newArr,arr);
		//  newArr[0].name="wgfbqkgw";//修改会影响原数组
		// console.log(newArr,arr);



 function clone(Origin,Target){

		 	
		 	if(Object.prototype.toString.call(Origin)=="[object Object]")
		 	{
		 		var Target=Target||{};
		 	}else if(Object.prototype.toString.call(Origin)=="[object Array]"){
		 		var Target=Target||[];
		 	}


		    for(var prop in Origin){
		 		if(Origin.hasOwnProperty(prop)){
				 		var a=Object.prototype.toString.call(Origin[prop]);

				 		if(a=="[object Array]" ){
				 			Target[prop]=[];
				 			clone(Origin[prop],Target[prop]);

				 		}else if(a=="[object Object]"){
				 			Target[prop]={};
				 			clone(Origin[prop],Target[prop]);


				 		}else{
				 			Target[prop]=Origin[prop];
				 		}
				 		


				}

				 		
			}
			return Target;
		 		
	}

4.every

Array.prototype.myEvery=function(func){
			var _self=this;
 			var len=_self.length;
 			var flag=true;
 			for(var i=0;i<len;i++){
				if(!func.apply(arguments[1]||window,[_self[i],i,_self])){
					flag=false;
					break;
				} 
 				 
 			}
 			return flag;
		}



		// var flag=arr.myEvery(function(ele,index,self){
		// 	return ele.age>=12;
		// },obj)
		// console.log(flag)

5.some

Array.prototype.mySome=function(func){
			var _self=this;
 			var len=_self.length;
 			var flag=false;
 			for(var i=0;i<len;i++){
				if(func.apply(arguments[1]||window,[_self[i],i,_self])){
					flag=true;
					break;
				} 
 				 
 			}
 			return flag;
		}

		// var flag=arr.mySome(function(ele,index,self){
		// 	return ele.age>=15;
		// },obj)
		// console.log(flag);

6.reduce


	Array.prototype.myReduce=function(func,initialValue){
		var _arr=this,len=this.length;
		for(var i=0;i<len;i++){
			initialValue=func.apply(arguments[1]||window,[initialValue,_arr[i],i,_arr])
		}
		return initialValue;
	}	

	var lastValue=arr.myReduce(function(preValue,curValue,index,self){
		console.log(preValue,curValue,index,self);
		 preValue.name=preValue.name+"e";
		return preValue
	},{name:'e'},obj)

在这里插入图片描述

Pumpkin~
关注
  • 2
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript(ES5)数组的方法总结
小妖666个人笔记
07-18 361
数组创建方式 1.直接创建 var arr = [1,2,3]; 2.通过new Array方式创建 var arr=new Array(1, 2, 3); ES5 数组方法 1.Array.isArray()方法用来判断一个值是否为数组 Array.isArray(arr) // true 2.valueOf()方法返回数组本身 arr.valueOf() //...
ES5新增数组的实现方法
11-20
下面将详细解释这些新增的数组实现方法： 1. **静态方法 `Array.isArray()`**： `Array.isArray()` 是用来判断一个变量是否为数组的静态方法。在JavaScript中，`typeof`运算符对于数组来说会返回`"object"`，而不...
ES5新增的数组方法
shimily_liu的博客
05-25 393
ES5新增的数组方法 关于ES5新增的数组方法，有如下几种： 1. indexOf(包含) 语法：indexOf(“元素”，[下标]) var arr = [6, 8, 34, 78, 0, 6, 3, 7]; console.log(arr.indexOf(4)) 【注】：检测arr数组中是否出现5这个数字,如果存在，就返回这个数字第一次出现的位置下标，如果不存在，则返回-1。但是与instaceOf不同的是，后者是用来判断某一变量是否是某对象的实例，返回布尔值。 lastIndexOf与indexOf正
ES5 新增方法 【数组方面】
egg_er的博客
01-06 530
ES5新增数组方法（常用） 新增了数组的快速遍历值，索引，数组：forEach, 快速查找数组中符合条件的所有值，索引,数组：filter 查询数组中有没有某个值，索引，数组：some filter 与 some的异同点： 相同点： 都是查询数组中符合条件的值 不同点： filter查询数组中满足条件的所有值，会把数组中所有满足条件的值都返回出来。返回值为一个新的数组，可以声明一个变量保存起来这个数组，方便进行其他的操作； some 返回值是布尔类型，作用主要是查找某个元素是否存在，不存在返回fa
ES5新增数组常用方法
Eling
04-12 437
ES5新增数组常用方法 indexOf() 跟字符串查找一样，查找指定元素是否存在，如果存在，返回下标，如果不存在返回-1 let arr = [1,2,3,4]; console.log(arr.indexOf(3)); // 2 lastIndexOf() 跟indexOf()一样，只是查找起始点不同，indexOf是从第一个开始查找， lastIndexOf()是从最后一个查找，如果...
ES5新增数组方法
zhang883的博客
09-14 156
ES5新增数组方法 foreach 遍历方法 foreach 函数遍历 var arr = [1, 2, 3, 4] //创建数组 var sum = 0; //创建变量sum 存放求和结果 arr.forEach(function (value, index, array) { //使用foreach函数 sum += value;
JavaScript ES5标准中新增的Array方法
10-22
以上就是在JavaScript ES5中新增的Array方法，它们提供了更高级的数组操作手段，使得开发者能够更加灵活和高效地处理数组数据。在编写JavaScript代码时，这些方法大大提升了代码的可读性和性能，尤其是在处理大量...
ES5新增方法：数组方法
在这个地方会介绍一些前端和后端的开发内容，暂时以JavaEE和Vue为主。
06-04 297
ES5新增方法，数组方法
es5中新增的数组方法
cx_joy的博客
01-28 722
1.浏览器支持情况：chrome8+、ff3.6+、IE9+ 2.forEach遍历  [1, 2, 3, 4].forEach(function (item, index, arr) {console.log(item);}); 支持3个参数：其中第一个参数代表数组内容，第二个参数是索引，第三个是数组本身. 除了第一必选的回调函数，还可接收一个可选参数来改变this指向。
ES5中新增的数组方法
生活步步是坎坷，笑到最后是大哥
06-03 225
1.indexof var arr=[23,44,12,04,5]; var n=arr.indexof(44);//返回44在数组中的下标 若找不到则返回-1； 2.foreach（参数是回调函数） 对数组的每个元素做某个处理 arr.foreach(alert);//显示数组的每个元素 arr.foreach(arr30); function arr30(num,index,arr){ arr...
ES5新增数组的方法
Walker_sis的博客
04-14 297
ES5中新增数组的方法 1.indexof() ​ 格式：数组.index(item, start); ​ 参数： item 任意的数据; ​ start 下标 查找的起始位置（可以不传入，默认是0) ​ 功能：在数组中查找第一次出现item元素下标，从start开始去查找 ​ 返回值： -1 没有查找到 >=0 查找到的元素的下标。 代码： ​ var arr = [10, 20, 30, 40, 50, 20,
es5新增的数组方法
xiamoziqian的博客
01-24 2465
常用的数组元素的迭代方法。 1. forEach()方法 forEach()方法的功能是循环遍历数组中的每一个元素； forEach()方法会接收一个函数； 这个函数包含三个形参，分别为：item, index, array, 用不到时可以不写 item 表示每次迭代的元素 index 表示每次迭代元素的下标 array 表示原数组 var arr = [20,13,11,8,0,11]; v...
ES5新增的数组的几个方法(every,forEach, map,filter,some)
qq_65846956的博客
03-09 381
共性：对数组进行循环，循环要做的事情都在回调函数里写了 一、forEach： 功能：遍历数组中每个元素， 参数：回调函数（回调函数的参数：数组的当前元素，下标，数组本身） 解释：回调函数的代码就是循环体里要执行的代码。 返回值：无。 var scores = [98,82,75,88,96,51,90]; scores.forEach((item,index,arr)=>{ item = item+1; arr[index...
ES5中数组的方法
zxlong020的博客
09-08 183
1.forEach 从头到尾遍历数组，为每个元素调用指定函数 第一个参数：传递的函数 该函数调用的参数：数组元素，元素索引，数组本身 例子： 2.map() 调用数组的每个元素传递给指定的函数，并返回一个包含返回值的新数组；传递给map()的函数有返回值，map()返回新数组，不会修改调用的数组；如果是稀疏数组，返回的也是相同方式的稀疏数组 例子： filter() 返回数组的一个子集，回调函数用于逻辑判断是否返回，返回true则把当前元素加入到返回数组中，false则不加； 新数组只包含true的值，
splice() 和 slice()的区别
weixin_44500533的博客
09-11 189
拼接数组 连续 splice() 方法可用于向数组添加新项：splice(2, 2, “Lemon”, “Kiwi”) 第一个参数（2）定义了应添加新元素的位置（拼接）。 第二个参数（0）定义应删除多少元素。 其余参数（“Lemon”，“Kiwi”）定义要添加的新元素。 splice() 方法返回一个包含已删除项的数组： 使用 splice() 来删除元素 通过聪明的参数设定，您能够使用 spli...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值