ICode9

精准搜索请尝试: 精确搜索
首页 > 其他分享> 文章详细

(38)2021-02-25(遍历方法总结:数组、对象、set集合、map集合)

2021-03-06 10:29:33  阅读:115  来源: 互联网

标签:02 map set ... item 25 集合 document foreach


遍历方法总结:数组、对象、set集合、map集合

一、数组

1、for循环

2、for…in

3、foreach

4、for…of

<script>
 var arr = [10, 20, 30, 40, 50];
        // 1、for循环
        for (let i = 0; i < arr.length; i++) {
            document.write("<p>for循环:当前元素为:" + arr[i] + ",下标为:" + i + "</p>");
        }
        // 2、for...in
        for (const key in arr) {
            document.write("<p>for...in:下标为:" + key + "</p>");
        }
        // 3、foreach
        arr.forEach((item, index) => {
                document.write("<p>forEach循环:当前元素为:" + item + ",下标为:" + index + "</p>");;
            })
        //4、for...of
        for (const item of arr) {
            document.write("<p>for...of循环:当前元素为:" + item + "</p>");;
        }
</script>

在这里插入图片描述

二、对象

1、 for…in

<script>
 var obj = {
            name: "周润发",
            age: "40",
            sex: "男"
        }

        for (const key in obj) {
            document.write("<p>对象遍历:当前属性为:" + key + ",属性值为:" + obj[key] + "</p>");
        }
</script>

在这里插入图片描述

三、set集合

1、for…of

2、foreach

<script>
 var set = new Set([10, 20, 30, 40, 50]);
        // 1、for...of 
        for (const item of set) {
            document.write("<p>set for...of循环:当前元素为:" + item + "</p>");;
        }
        //  2、foreach
        set.forEach(item => {
            document.write("<p>set foreach循环:当前元素为:" + item + "</p>");;
        });
</script>

在这里插入图片描述

四、map集合

1、for…of

2、foreach

<script>
let map = new Map();
        map.set("郑爽", "流星雨");
        map.set("马老师", "年轻人不讲武德");
        map.set("浑元形意太极拳掌门", "好自为之");
        map.set("罗志祥", "爱转角");
        // 1、for...of 
        for (const item of map.keys()) {
            document.write("<p>map for..of遍历:当前键为:" + item + ",值为:" + map.get(item) + "</p>");
        }
        //  2、foreach
        map.forEach((value, key) => {
            document.write("<p>map forEach遍历:当前键为:" + key + ",值为:" + value + "</p>");
        })
</script>

在这里插入图片描述

标签:02,map,set,...,item,25,集合,document,foreach
来源: https://blog.csdn.net/weixin_53125613/article/details/114105244

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有