JavaScript教程-41-函数原型对象练习

最新推荐文章于 2022-07-29 12:08:25 发布

木易yves

最新推荐文章于 2022-07-29 12:08:25 发布

阅读量188

点赞数

分类专栏： javascript 文章标签： javascript

本文链接：https://blog.youkuaiyun.com/qq_35938103/article/details/105393653

版权

javascript 专栏收录该内容

44 篇文章

订阅专栏

1：给数组添加可以遍历多维数组的each() 方法

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>利用原型对象给Array添加each遍历方法</title>
		<script type="text/javascript">
			//数组有一个遍历的方法 forEach
			//定义多维数组，三维的
			var arr = [1,2,[3,[4,5]]];
			//使用forEach遍历该数组
			//item：被遍历的每一个元素
			//index：被遍历元素的索引
			//array：被遍历的数组
			arr.forEach(function(item,index,array){
				//打印每一个数组的元素
				alert(item);
			});
			//遍历的结果为，该方法只能遍历一维数组，输出的时候，3，4，5一起输出了。
			
			//接下来，通过函数原型对象，给Array数组，添加each 方法，用来遍历多维数组元素。
			//参数为一个方法 fn ，可以接受一个参数 item（数组中的每一个元素） 的方法
			Array.prototype.each = function(fn){
				//定义指向每个元素的索引index
				this.index || (this.index = 0);
				
				//当数组的长度大于0，并且fn是方法的时候
				if(this.length > 0 && fn.constructor == Function){
					//使用循环逐个遍历
					while(this.index < this.length){
						//获取数组元素的每一项
						var e = this[this.index];
						//如果元素还是数组，递归调用
						if( e && e.constructor == Array){
							e.each(fn);
						}else{
							//否则元素作为实参执行fn 方法
							fn.call(e,e);
						}
						this.index ++;
					}
					//回收index
					this.index = null;
				}
			}
			
			//测试  输出结果 1，2，3，4，5
			arr.each(function(item){
				alert(item);
			});
			
		</script>
	</head>
	<body>
	</body>
</html>

PS：笔者有大量的学习资料：java、python、大数据、人工智能、前端等。需要的小伙伴请加群：711408961

笔者的b站中有一些教学视频分享。感兴趣的小伙伴可以关注：https://space.bilibili.com/412362068