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)
posted @   二郎神杨戬  阅读(8517)  评论(0)  编辑  收藏  举报
编辑推荐：
· Linux系列：如何用 C#调用 C方法造成内存泄露
· AI与.NET技术实操系列（二）：开始使用ML.NET
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识（上）
阅读排行：
· 阿里最新开源QwQ-32B，效果媲美deepseek-r1满血版，部署成本又又又降低了！
· 单线程的Redis速度为什么快？
· SQL Server 2025 AI相关能力初探
· 展开说说关于C#中ORM框架的用法！
· AI编程工具终极对决：字节Trae VS Cursor，谁才是开发者新宠？
点击右上角即可分享
微信分享提示