for的几种循环

for循环主要有以下几种：

1.一般的for循环

2.for-in循环

3.forEach循环

4.for-of循环

一.首先是普通的for循环，例如：

     var arr = ["a","b","c"];
     for(var i = 0; i < arr.length; i++) {
                console.log(arr[i]);
     }

二.for-in循环

遍历数组索引、对象的属性，使用for…in遍历时，原型链上的所有属性都将被访问

用法如下：

	//数组
	var arr = ["星期一","星期二","星期三"];
	Array.prototype.something = ["放假","休息咯"];
	for (var i in arr){ // i是下标（索引）
		console.log(arr[i])
	}

如果把该例子的数组，写成像上面的对象数组，效果与数组也是一样的，就不再次用对象数组来测试了。

			//对象
			var obj = {guangzhou: '广州', shanghai: '上海', beijing: '北京'}
			Object.prototype.something2={shenzhen:'深圳'}
			for (var i in obj){ 
			console.log(obj[i])
			}

解决方法：使用hasOwnProperty() hasOwnProperty()方法可以检测一个属性是存在于实例中，还是存在于原型中。这个方法只在给定属性存在于对象实例中时，才会返回true。

			//数组
			var arr = ["星期一","星期二","星期三"];
			Array.prototype.something = ["放假","休息咯"];
			for (var i in arr){
			if(arr.hasOwnProperty(i)){ 
			console.log(arr[i])
				}
			}

				//对象
			var obj = {guangzhou: '广州', shanghai: '上海', beijing: '北京'}
			Object.prototype.something2={shenzhen:'深圳'}
			for (var i in obj){ 
			if(obj.hasOwnProperty(i)){
				console.log(obj[i])
			}
			}

三.forEach

不能中断循环(比如说使用break语句或使用return语句）

	let arr = ['a', 'b', 'c', 'd']
	arr.forEach(function (val, idx, arr) {
	 console.log(val + ', index = ' + idx) // val是当前元素，index当前元素索引，arr数组
  console.log(arr)
	})

输出结果：

	a, index = 0
	(4) ["a", "b", "c", "d"]
	b, index = 1
	(4) ["a", "b", "c", "d"]
	c, index = 2
	(4) ["a", "b", "c", "d"]
	d, index = 3
	(4) ["a", "b", "c", "d"]

四.for-of

1.目前遍历 数组 最便利的方法

2.避免了for-in，forEach的所有缺陷

3.可以用在 类数组，字符串，set和map数据 上

4.不支持对象的遍历（但是它提供了其他的三种方法）
①Object.keys()
②Object.values()
③Object.entries()

循环一个数组

let arr = ['China', 'America', 'Korea']
for (let o of arr) {
console.log(o) //China, America, Korea
}

for-of是可以跳出循环的（避免了forEach的缺陷）

	var arr = ['q','w','e'];
   for(var v of arr){
    console.log(v);
    break;
 }
 此时只会输出了一个q，说明跳出循环了

for-of也可以循环字符串

		let str = 'love'
		for (let o of str) {
		  console.log(o) // l,o,v,e
		}

但是它并不能循环一个普通对象

let obj = {a: '1', b: '2', c: '3', d: '4'}
for (let o of obj) {
console.log(o)   //Uncaught TypeError: obj[Symbol.iterator] is not a function
}

for-of不支持对象的遍历，但是它提供了另外的其他三种方法，

（1）Object.keys() 把对象的属性给遍历出来，这里面Object.keys()，O要大写

	let obj = {a: '1', b: '2', c: '3', d: '4'}
	for (let o of Object.keys(obj)) {
	   console.log(o) // a,b,c,d
		}

（2）Object.values() 把对象的属性值给遍历出来，这里面Object.keys()，O要大写

	let obj = {a: '1', b: '2', c: '3', d: '4'}
	for (let o of Object.values(obj)) {
	 console.log(o) // 1,2,3,4
	}

（3）Object.entries() 把对象的属性和属性值给遍历出来，这里面Object.keys()，O要大写

	var obj = {
    name:"hello",
    age:"18"
    };
   for(var i of Object.entries(obj)){
    console.log(i);
  }
  ![在这里插入图片描述](https://img-blog.csdnimg.cn/20190531115404336.png)

【注意】此时是数组

总结：
for（最原始的写法）、 forEach（ES5，但是它不支持使用break、continue和return语句）、for…of（ES6，循环数组的元素值）这三个是循环数组（对象数组）的；
for…in循环数组索引、对象的属性，但使用 for…in 原型链上的所有属性都将被访问，用 hasOwnProperty() 方法解决。