• 技术文章 >web前端 >js教程

    JavaScript获取关联数组的键的两种方法

    藏色散人藏色散人2021-08-25 11:26:03原创703
    在上一篇《JavaScript如何获取数字数组的中位数(两种方法)》中给大家介绍了怎么获取数字数组的中位数,感兴趣的朋友可以学习了解一下~

    本文的主要内容则是通过两种方法教大家如何使用JavaScript获取关联数组的键。

    首先给大家简单介绍一下什么是关联数组?

    关联数组:关联数组用于存储键值对。例如,要将学生不同科目的分数存储在数组中,数字索引数组肯定不是最佳选择。相反,我们可以使用学生姓名作为关联数组中的键,值将是它们各自获得的分数。在关联数组中,键值对与:符号相关联。

    下面就给大家介绍两种方法获取关联数组的键。

    方法一:

    在该方法中,使用for循环遍历整个关联数组,并显示数组的关键元素。

    语法:

    for (var key in dictionary) {
      // ...
    }

    完整示例代码如下:循环遍历关联数组和打印键

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8" />
        <title></title>
        <script>
    
            var arr = {
                "牛顿": "重力",
                "艾伯特": "能源",
                "爱迪生": "灯泡",
                "特斯拉": "AC"
     };
    
            document.write("显示的Keys: <br>");
    
            // 循环打印keys
     for (var key in arr) {
                if (arr.hasOwnProperty(key)) {
    
                    // 打印Keys
     document.write(key + "<br>");
                }
            }
        </script>
    </head>
    <body>
    </body>
    
    </html>

    打印结果:

    显示的Keys:
    牛顿
    艾伯特
    爱迪生
    特斯拉

    方法二:

    使用Object.keys()函数: Object.keys() 是 JavaScript 中的一个内置函数,可用于获取数组的所有键。

    语法:

    Object.keys(obj)

    示例代码如下:使用 Object.keys() 访问关联数组的键。

    <!DOCTYPE html>
    <html lang="en">
    
    <head>
        <meta charset="UTF-8" />
        <title></title>
        <script>
    
            var arr = {
                "牛顿": "重力",
                "艾伯特": "能源",
                "爱迪生": "灯泡",
                "特斯拉": "AC"
     };
    
            // 获取keys
     var keys = Object.keys(arr);
    
            document.write("Keys显示如下:<br>");
    
            // 打印keys
     document.write(keys);
        </script>
    </head>
    <body>
    </body>
    
    </html>

    打印结果如下:

    Keys显示如下:
    牛顿,艾伯特,爱迪生,特斯拉

    最后给大家推荐《JavaScript基础教程》~欢迎大家学习~

    以上就是JavaScript获取关联数组的键的两种方法的详细内容,更多请关注php中文网其它相关文章!

    声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理
    专题推荐:JavaScript
    上一篇:JavaScript如何获取数字数组的中位数(两种方法) 下一篇:浅析javascript中Reflect内置对象(代码详解)
    线上培训班

    相关文章推荐

    • 详解怎么使用JavaScript打印div元素的内容• 你值得了解的JavaScript“继承之jquery”使用方法(代码详解)• 深入解析JavaScript中对象拷贝方法(附代码)• JavaScript如何获取数字数组的中位数(两种方法)

    全部评论我要评论

  • 取消发布评论发送
  • 1/1

    PHP中文网