遍历的4种写法, for/map/forEach/find

最新推荐文章于 2024-07-29 03:48:42 发布

原创最新推荐文章于 2024-07-29 03:48:42 发布 · 置顶 · 922 阅读

1 ·

CC 4.0 BY-SA版权

Js 专栏收录该内容

26 篇文章

订阅专栏

本文深入探讨了Vue项目中使用localStorage进行数据存储的方法，并对比了forEach、for循环、map及find四种遍历方式的优劣，旨在提高前端应用的性能与代码可读性。

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

getCrumbs(){
    let crumbs = JSON.parse(localStorage.getItem( "crumbs" )); 
    //[Vue warn]: Error in created hook: "TypeError: Cannot set property 'manageClass' of undefined" 报错
  
    // forEach写法
    crumbs.forEach(item => {
        console.log(item);                    
        if (item.name === "staffInfo") {
            this.manageClass = item.manageClass
            this.infoClass = item.infoClass; 
        }
    })

    //  或者使用for循环
    for (let i = 0; i < crumbs.length; i++) {
        if (crumbs[i].name === "staffInfo") {
            this.manageClass = crumbs[i].manageClass
            this.infoClass = crumbs[i].infoClass; 
        }                  
    }

     //map写法
    crumbs.map( (item) => {
        if (item.name == "staffInfo") {
            // return item.manageClass 
            this.manageClass = item.manageClass
            this.infoClass = item.infoClass;                        
        }
    } )

    // find写法                
    if (crumbs) {                                  
        var arr = crumbs.find((item) => (item.name === "staffInfo"));    
        this.manageClass = arr.manageClass
        this.infoClass = arr.infoClass; 
    }
   
},