一、官方解釋
Object.keys() 方法會返回一個由一個給定對象的自身可枚舉屬性組成的數(shù)組,數(shù)組中屬性名的排列順序和使用 for...in 循環(huán)遍歷該對象時返回的順序一致 。如果對象的鍵-值都不可枚舉,那么將返回由鍵組成的數(shù)組。
二、語法
Object.keys(obj)
參數(shù):要返回其枚舉自身屬性的對象
返回值:一個表示給定對象的所有可枚舉屬性的字符串?dāng)?shù)組
三、處理對象,返回可枚舉的屬性數(shù)組
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Object.keys()處理對象,返回可枚舉的屬性數(shù)組</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>

image
四、處理數(shù)組,返回索引值數(shù)組
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Object.keys()處理數(shù)組,返回索引值數(shù)組</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>

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

image
六、實用技巧
<!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];//獲得屬性對應(yīng)的值,可以進行其它處理
})
</script>
</body>
</html>
七、Object.values()和Object.keys()是相反的操作,把一個對象的值轉(zhuǎn)換為數(shù)組
注意:在ES5里,如果此方法的參數(shù)不是對象(而是一個原始值),那么它會拋出 TypeError。在ES2015中,非對象的參數(shù)將被強制轉(zhuǎn)換為一個對象
Object.keys("foo");
// TypeError: "foo" is not an object (ES5 code)
Object.keys("foo");
// ["0", "1", "2"] (ES2015 code)