es5数组拓展，forEach遍历方法_es 数组遍历 foreach-优快云博客

本文深入探讨JavaScript数组的forEach方法，解析其工作原理并提供源码级的实现方式，通过具体示例帮助读者理解如何使用及其实现机制。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

forEach方法的详解：

array.forEach(function(currentValue, index, arr), thisValue);该方法接受两个参数，一个是数组中每个元素需要调用的函数，另一个是该函数内的this指向，如果不传默认是window,传指了就指向该值。

上代码：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>数组扩展</title>
</head>
<body>
<ul>
	<li></li>
	<li></li>
	<li></li>
	<li></li>
</ul>

<script>
	// forEach 遍历数组
	var personArr = [
		{name:'王一',des:'有病',sex:'m'},
		{name:'王二',des:'有钱',sex:'f'},
		{name:'王三',des:'有才',sex:'f'},
		{name:'王四',des:'有病',sex:'m'},
	];
	
	//forEach的源码实现
	//1.function 2.length 3.function this -> arguments[1]
	Array.prototype.myForEach = function(fn){
		var _arr = this,len = _arr.length,param2 = arguments[1] || window;
		for(var i = 0; i < len; i++){
			//ele 对应执行当前次的数据 元素
			//index 索引
			//self 数组本身
			fn.apply(param2,[_arr[i],i,_arr])
		}
	}

	personArr.myForEach(function(ele,index,self){
		console.log(ele,index,self,this);
		this[index].innerText = ele.name;
	},document.getElementsByTagName('li'));
	

</script>
	
</body>
</html>