xinxin?

JavaScript：常用的一些数组遍历的方法

常用的一些遍历数组的方法：

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
    </head>
    <body>
        <script type="text/javascript">
            var students=[
                    {
                        name:'小红',
                        age:20,
                        sex:'女'
                    },
                    {
                        name:'小华',
                        age:18,
                        sex:'男'
                    },
                    {
                        name:'小多',
                        age:22,
                        sex:'男'
                    }
                ];
                
            //数组遍历之forEach：就是单纯遍历数组
            var he1=students.forEach(function(item,index,arr){
                item.sex='男'
                return item;
            });
            console.log(he1); //无返回值
            console.log(students) //会改变原数组，此处在控制台会打印性别全是女，因为后面的代码改了，指针问题（打断点看）
            
            //数组遍历之for in：这个是遍历对象的方法
            for(var k in students){
                console.log('k代表',k); //数组里k代表下标，对象里k代表键
                console.log(students[k].age);
            }
            
            //数组遍历之map：特点就是有返回值，可以返回新的数组
            var he2=students.map(function(item,index,arr){
                item.sex='女'
                return item;
            });
            console.log(he2); //有返回值
            console.log(students) //会改变原数组
            
            //筛选数组之filter：特点就是返回筛选后的数组
            var he3=students.filter(function(item,index,arr){
                return item.sex=='男'; //将符合条件json对象，作为一个数组返回
            });
            console.log(he3);

            //检查数组之some：如果有一个元素满足条件，则表达式返回true , 剩余的元素不会再执行检测
            var hx4=students.some(item=>{
                return item.age>18
            })
            console.log(hx4)

            //检查数组之every：所有元素都满足则返回true
            var hx5=students.every(item=>{
                return item.age>18
            })
            console.log(hx5)

            //检查数组之find：返回符合条件的第一个元素,没有则返回undefined
            var hx6=students.find(item=>{
                return item.age>18
            })
            console.log(hx6)
        </script>
    </body>
</html>

 

posted on 2020-08-04 23:30  xinxin?  阅读(173)  评论(0)    收藏  举报

导航