JavaScript—数组和对象的遍历

最新推荐文章于 2023-06-03 18:43:29 发布

九阈

最新推荐文章于 2023-06-03 18:43:29 发布

阅读量210

点赞数

分类专栏： # JavaScript 文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/weixin_46048542/article/details/122847489

版权

JavaScript 专栏收录该内容

41 篇文章 0 订阅

订阅专栏

数组：
    for循环
    for...in快速遍历
    forEach

举个列子

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /*
        数组：
        for循环
        for...in快速遍历
        forEach
        */
       var arr = [10,20,30,40,50];
       //for循环
       for(var i = 0; i < arr.length; i++){
           document.write("for, " + i + ", "+ arr[i] + "<br/>");
       }

       // for...in快速遍历
       for(var i in arr){
           document.write("forin, " + i + ", "+ arr[i] + "<br/>");
       }

       //forEach
       arr.forEach(function(item,index,arr){
           document.write("forEach, " + index + ", "+ item+ "<br/>");
       });
    </script>
</head>
<body>
    
</body>
</html>

arr.forEach(function(item,index,arr)中item是当前遍历到的元素，index是当前遍历到的元素下标，arr是数组本身
请添加图片描述

对象遍历

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
       //对象遍历
       var person = {
           username: "烂柯棋缘",
           age:18,
           sex:"男",
           hero: "计缘"
       };
       //对象遍历 for....in
       for(var i in person){
           //i是当前遍历到的属性
           document.write("对象遍历: "+ i + ", "+person[i] + "<br/>");
       }
    </script>
</head>
<body>
    
</body>
</html>