JS获取对象key方式

JS作为前端开发的基础语言，对象在JS中起着重要的作用。而获取对象中的key也是我们经常需要掌握的技能。在这篇文章中，我们将介绍JS获取对象key的几种方式。

一、Object.keys()

Object.keys()方法返回一个对象中已定义的属性的所有键名, 以字符串数组的形式。该方法的语法如下：

Object.keys(obj);

其中obj是一个对象，该方法返回的是obj中所有已定义属性的键名。例如：

let obj = {a:8, b:12, c:15}
console.log(Object.keys(obj));
// ["a", "b", "c"]

二、for...in循环

使用for...in循环可以遍历对象中的所有可枚举属性，对象中所有属性都将被枚举，包括其原型链上的属性。for...in循环的语法如下：

for (variable in object){
    //代码块
}

其中variable是一个局部变量，object是对象或数组。例如：

let obj = {a:8, b:12, c:15};
for(let key in obj){
    console.log(key);
}
// "a"
// "b"
// "c"

三、Object.getOwnPropertyNames()

Object.getOwnPropertyNames()方法返回一个数组，该数组包含了对象自身所有属性（不包括继承的属性）的属性名。该方法的语法如下：

Object.getOwnPropertyNames(obj)

其中obj是一个对象，该方法返回的是obj中所有自身属性的键名。例如：

let obj = {a:8, b:12, c:15};
console.log(Object.getOwnPropertyNames(obj));
// ["a", "b", "c"]

四、Reflect.ownKeys()

Reflect.ownKeys()方法返回一个由目标对象自身的属性和方法组成的数组，包括不可枚举属性，由 Symbol 类型的属性键名组成的数组。其语法如下：

Reflect.ownKeys(target)

其中target是一个对象，该方法返回的是target自身所有属性和方法的键名。例如：

let obj = {a:8, b:12, c:15};
console.log(Reflect.ownKeys(obj));
// ["a", "b", "c"]

五、解构赋值

使用ES6的解构赋值，我们也可以将对象的key赋值给变量。其语法如下：

let {key1, key2, …, keyN} = object;

其中key1, key2, …, keyN是对象中定义的属性名称，例如：

let obj = {a:8, b:12, c:15};
let {a, b, c} = obj;
console.log(a);
console.log(b);
console.log(c);
// 8
// 12
// 15

六、使用Map结构

使用ES6新增的Map结构，我们也可以方便的获取对象中的key。例如：

let obj = {a:8, b:12, c:15};
let map = new Map(Object.entries(obj));
for(let [key, value] of map){
    console.log(key);
}
// "a"
// "b"
// "c"

七、小结

以上就是JS获取对象key的几种方式。Object.keys()，for...in循环，Object.getOwnPropertyNames()和Reflect.ownKeys()方法都是一些比较基础的方法，掌握它们能够让你更加便捷地操控对象。同时，使用ES6的解构赋值和Map结构也能够非常方便地获取对象中的key。

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com