首页 » 技术分享 » 数组和对象的遍历

数组和对象的遍历

　
评论关闭　872次浏览

数组和对象的遍历

1. 数组的遍历

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

  • 普通的for循环，

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

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

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

  • for of循环，只会遍历数组中的每一项，不是遍历的键名

    for(var i of arr){
    console.log(i)
}//1,2,3

  • foreach遍历数组，三个参数依次是数组元素、索引、数组本身(IE9以下不支持)

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

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

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

  • filter函数，过滤通过条件的元素组成一个新数组，原数组不变

    var newarr = arr.filter((item, index) => {
    console.log(item, index);//1,0 2,1 3,2
    return item;
})
 console.log(newarr);//1,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. 对象相关的遍历

var 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"}

转载自原文链接, 如需删除请联系管理员。

原文链接：数组和对象的遍历，转载请注明来源！

赞 0