数组和对象的遍历

数组和对象的遍历

1. 数组的遍历

var arr = [1,2,3];
arr.a = 4；
Array.prototype.name = 'name';

• 普通的for循环，break可以跳出循环

for(var i = 0; i<arr.length; i++){
	console.log(arr[i]) // 1 2
	if(arr[i] > 1) break
	console.log(arr[i]) // 1
}

• for in循环，会把原型上的属性和属性值都遍历下来，遍历的是键名,break可以跳出循环

for(var i in arr){
	console.log(arr[i])
}//1,2,3,4,'name'

for(var i in arr){
	console.log(arr[i]) // 1 2
	if(arr[i] > 1) break
	console.log(arr[i]) // 1
}

• for of循环，只会遍历数组中的每一项，不是遍历的键名
  • 可以遍历伪数组
  • break可以跳出循环
  • 不能使用对象
  • for...of循环内部调用的是数据结构的Symbol.iterator方法
  • 使用的范围包括数组、Set 和 Map 结构、某些类似数组的对象（比如arguments对象、DOM NodeList 对象）、后文的 Generator 对象，以及字符串

for(var i of arr){
	console.log(i) // 1 2
	if(i > 1) break
	console.log(i) // 1
}

• foreach遍历数组，三个参数依次是数组元素、索引、数组本身(IE9以下不支持)
  • 不支持continue和break语法
  • 如果想实现continue效果，可以使用return
  • 实现break效果，建议使用every和some循环

arr.forEach((item,index)=>{
    console.log(item) // 1 2 3
	if (item > 1) {
		return
	}
	console.log(item) // 1
})

• map函数，遍历数组每个元素，并回调操作，需要返回值，返回值组成新数组，原数组不变，不能跳出循环

var newarr = arr.map((item, index) => {
 	console.log(item) // 1 2 3
	if (item > 1) {
		return item
	}
	console.log(item) // 1
})
 console.log(newarr); // [undefined, 2, 3]

• filter函数，过滤通过条件的元素组成一个新数组，原数组不变,不能跳出循环

var newarr = arr.filter((item, index) => {
 	console.log(item) // 1 2 3
	if (item > 1) {
		return item
	}
	console.log(item) // 1
})
console.log(newarr); // [2, 3]

• some函数，遍历数组中是否有符合条件的函数，返回布尔值,找到符合的即停止，返回true;遍历全部还没找到返回false

var newarr2 = arr.some((item,index)=>{
 console.log(item, index);//1,0 2,1 3,2
	return item === 4
})
console.log(newarr2);//false

• every函数，遍历数组是否每个元素都符合条件，返回布尔值,找到不符合的即停止，返回false；

var newarr3=arr.every(function(item,index){
console.log(item, index);
  return item===1
});
console.log(newarr3)
//1,0 2,1 false

• find函数，遍历数组用于找出第一个符合条件的数组成员。它的参数是一个回调函数，所有数组成员依次执行该回调函数，直到找出第一个返回值为true的成员，然后返回该成员。如果没有符合条件的成员，则返回undefined。

var newarr4 = arr.find((item,index)=>{
	console.log(item,index)
	return item ===2
})
console.log(newarr4)
//1,0  2,1  2

• entries()对键值对的遍历,keys()是对键名的遍历,values()是对键值的遍历,只能遍历原数组

for(let item of arr.values()){
	console.log(index,item)
}//1 2 3 
keys()方法同理
for(let [index,item] of arr.entries()){
	console.log(index,item)
}//0 1  1 2  2 3

• 如果不使用for...of方法进行遍历的话，可以手动掉用那个遍历器对象的next方法，进行遍历

let arr1 = ['a','b','c']
let entr = arr1.entries();
console.log(entr.next().value);//[0,'a']
console.log(entr.next().value);//[1,'b']
console.log(entr.next().value);//[2,'c']
console.log(entr.next().value);//undefined

2. 对象相关的遍历

let obj = {
    a: 'b',
    c: 'd'
}

• for in循环遍历，会把原型链上所有可枚举的属性和方法遍历出来

  Object.prototype.test = 'myTest'
  for (let key in obj) {
      console.log('key: ' + key + ',' + 'value: ' + obj[key])
  }
  //key: a,value: b
  //key: c,value: d
  //key: test,value: myTest
  

  • 对于不可枚举的属性(enumerable:false),比如说toString方法，那么for in就不会遍历到

  Object.defineProperty(Object.prototype,'test',{
  	enumerable:false,//设为不可枚举，就无法遍历到，改为true就可遍历到
  	value:'myTest'
  })
  for(let key in obj){
  	console.log('key:'+key+',value:'+obj[key])
  }
  //key: a,value: b
  //key: c,value: d
  

  • 由于for in遍历会遍历原型链上的属性，所以一般我们想要遍历对象本身的属性的时候，要加上hasOwnProperty来进行一层过滤

  Object.prototype.test = 'myTest'
  for(let key in obj){
  	if(obj.hasOwnProperty(key)){
  		console.log('key:'+key+',value:'+obj[key])
  	}
  }
  //key: a,value: b
  //key: c,value: d
  

• Object.keys()只遍历自身的可枚举属性，返回包含keys值数组;

• Object.values()用法和keys一样，返回包含values值数组;

• Object.entries()用法和keys一样，返回键值对数组;

• Object.getOwnPropertyNames()遍历自身属性包含不可枚举的，返回key值数组

• Object.getOwnPropertySymbols(obj),返回一个数组,包含对象自身的所有Symbol属性.

• Reflect.ownKeys(obj),返回一个数组,包含对象自身的所有属性,不管属性名是Symbol或字符串,也不管是否可枚举.

• Reflect.enumerate(obj),返回一个Iterator对象,遍历对象自身的和继承的所有可枚举属性(不含Symbol属性),与for ... in 循环相同.

Object.prototype.test = 'myTest'
Object.defineProperty(obj,'non-em',{
    enumerable: true, //enumerable为false时不可遍历 为true时可以遍历到
    value: 'deejay'
})
let keys = Object.keys(obj)
console.log(keys) // ["a", "c", "non-em"]

let values = Object.values(obj)
console.log(valuse)//["b","d","deejay"]

let entries = Object.entries(obj)
console.log(entriies)//[["a","c"],["b","d"],["non-em","deejay"]]

let reKeys = Reflect.ownKeys(obj)
console.log(reKeys)// ["a", "c", "non-em"]

let reEnu = Reflect.enumerate(obj)
console.log(reEnu)
//_k:["a", "c","test", "non-em"]
  _t:{a: "b", c: "d", test: "myTest", non-em: "deejay"}