zoukankan      html  css  js  c++  java
  • javascript学习总结之Object.keys()方法详解

    一、官方解释

    Object.keys() 方法会返回一个由一个给定对象的自身可枚举属性组成的数组,数组中属性名的排列顺序和使用 for...in 循环遍历该对象时返回的顺序一致 。如果对象的键-值都不可枚举,那么将返回由键组成的数组。

    二、语法

    Object.keys(obj)
    参数:要返回其枚举自身属性的对象
    返回值:一个表示给定对象的所有可枚举属性的字符串数组

    三、处理对象,返回可枚举的属性数组

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title>Object.keys()处理对象,返回可枚举的属性数组</title>
        </head>
        <body>
            <script type="text/javascript">
                let person={
                    name:'一只流浪的kk',
                    age:20,
                    eat:function(){}
                }
                console.log(Object.keys(person));//    ['name','age','eat']
            </script>
        </body>
    </html>

    四、处理数组,返回索引值数组

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title>Object.keys()处理数组,返回索引值数组</title>
        </head>
        <body>
            <script type="text/javascript">
                let arr=[1,2,3,4,5];
                console.log(Object.keys(arr));//['0','1','2','3','4','5']
            </script>
        </body>
    </html>

    五、处理字符串,返回索引值数组

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title>Object.keys()处理字符串,返回索引值数组</title>
        </head>
        <body>
            <script type="text/javascript">
                let str='hello';
                console.log(Object.keys(str));//['0','1','2','3','4']
            </script>
        </body>
    </html>

    六、实用技巧

    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="UTF-8">
            <title></title>
        </head>
        <body>
            <script type="text/javascript">
               let person={
                       name:'一只流浪的kk',
                       age:18,
                       eat:function(){
                           
                       }
               }
               Object.keys(person).map((key)=>{
                       person[key];//获得属性对应的值,可以进行其它处理
               })
            </script>
        </body>
    </html>

    七、Object.values()和Object.keys()是相反的操作,把一个对象的值转换为数组

     注意:在ES5里,如果此方法的参数不是对象(而是一个原始值),那么它会抛出 TypeError。在ES2015中,非对象的参数将被强制转换为一个对象

    Object.keys("foo");
    // TypeError: "foo" is not an object (ES5 code)
    
    Object.keys("foo");
    // ["0", "1", "2"]                   (ES2015 code)
  • 相关阅读:
    去除百度搜索结果中的广告的 js 代码
    js获取url参数
    奇淫技巧
    js生成hash序列
    Maven中可以被继承的POM元素
    多线程
    IO在Socket中的应用
    关于IO的整理
    finalize方法的使用
    复合赋值和简单复制的区别
  • 原文地址:https://www.cnblogs.com/jjgw/p/11647012.html
Copyright © 2011-2022 走看看