for forEach for...in for...of 区别

	let arr = [10, 20, , 30, 40, 50] // 角标2是一个空值
	arr.demo = 60 // 额外添加的属性
	Array.prototype.test=function(){} // 原型上添加的属
	let obj = {
		name: 'liu',
		age: 99
	}
	obj.sex = '男'
	Object.prototype.demo = function(){} // 原型上添加的属性

普通for循环

	for(let i=0, len=arr.length; i<len; i++){
		console.log(arr[i])
	}
	// 打印结果
	// 10 20 undefined 30 40 50

• 不会循环原型上可枚举的属性
• 可使用break、continue、return
• 遍历时不会跳过空值

forEach

	arr.forEach((item,index,originArr) =>{
			if(index ===1){
	  		return
			}
			console.log(item, typeof index)
	})
	// 打印结果
	// 10 "number", 30 "number", 40 "number", 50 "number"

• forEach只是for循环的扩展，不会循环原型上可枚举的属性
• 多用于遍历数组
• 不可使用break、continue，使用return并不能终止循环只是起到了continue的作用
• 遍历时会跳过空值

for…in

遍历数组

	function test1(){
		for(let i in arr){
		console.log(i, typeof i, arr[i]) // 注意:i是字符串角标
	 	}
	}
	test1()

打印结果

	0 string 10
	1 string 20
	3 string 30
	4 string 40
	5 string 50
	demo string 60
	test string ƒ (){}

遍历对象

	for(let i in obj){
		console.log(i)
	}
	// 打印结果
	// name age sex demo

注意：return 语句用来终止一个函数的执行，所以只能用在函数中，否则会报语法错误

• for(let i in arr) 循环数组时，i值是字符串数字，不可进行几何运算，但幸运的是js支持arr[‘1’]这种方式获取角标对应的值
• 会循环原型上可枚举的属性
• 多用于循环对象数据，不建议循环数组
• 遍历数组时，遍历顺序有可能不是按照实际数组的内部顺序，所以不建议遍历数组
• 支持break、continue、return
• 遍历数组时会跳过空值

for…of

	function test2(){
		for(let i of arr){
			console.log(i, typeof i)
		}
	}
	test2()
	console.log(arr, arr.length)

打印结果

	10 "number"
	20 "number"
	undefined "undefined"
	30 "number"
	40 "number"
	50 "number"
	[10, 20, empty, 30, 40, 50, demo: 60]    6

• 可遍历拥有iterator迭代器对象的集合，如数组、类数组、字符串、Set、Map，不支持普通对象
• 可直接获取数组中的值
• 只循环数组本身元素，不循环原型上或额外添加的属性
• 支持break、continue、return
• 遍历时不会跳过空值

return 语句只能在函数体中，否则会报错

	<script type="text/javascript">
		let arr = [1,2,3]
		for(let i=0; i<ar.length; i++){
			if(i === 1){
				return
			}
		}
		// 报错
		// Uncaught SyntaxError: Illegal return statement
	</script>