<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Object.keys方法之详解</title>
</head>
<body>
<h2>Object.keys方法之详解</h2>
<h3> 一、语法</h3>
<div>
<pre>
Object.keys(obj)
参数：要返回其枚举自身属性的对象
返回值：一个表示给定对象的所有可枚举属性的字符串数组
</pre>
</div>
<h3>二、处理对象，返回可枚举的属性数组</h3>
<div>
<pre>
let person = { name: ‘tom‘, age: 25, address: ‘南非‘,getName:function(){}}
Object.keys(person) // ["name", "age", "address","getName"]
</pre>
<script>
let person = { name: ‘tom‘, age: 25, address: ‘南非‘, getName: function () { } }
console.log(Object.keys(person))
</script>
</div>
<h3>三、处理数组。返回索引值数组</h3>
<div>
<pre>
let arr = [1,2,3,4,5,6]
Object.keys(arr) // ["0", "1", "2", "3", "4", "5"]
</pre>
<script>
let arr = [1, 2, 3, 4, 5, 6]
console.log(Object.keys(arr)) // ["0", "1", "2", "3", "4", "5"]
</script>
</div>
<h3>四、处理字符串，返回索引值数组 </h3>
<div>
<pre>
let str = "object.obj字符串"
Object.keys(str) // ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"]
</pre>
<script>
let str = ‘object.obj字符串‘;
console.log(Object.keys(str)) //["0", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"]
</script>
</div>
<h3>使用案例</h3>
<div>
<pre>
//get请求
let url = ‘http://localhost:8081‘
let data = { name: ‘tom‘, age: 25, address: ‘南非‘ };
let dataStr = ‘‘;//拼接字符串
Object.keys(data).forEach(key => {
dataStr += key + ‘=‘ + data[key] + ‘&‘
})
console.log(dataStr)
if (dataStr !== ‘‘) {//拼接字符串
dataStr = dataStr.substring(0, dataStr.lastIndexOf(‘&‘))
url = url + ‘?‘ + dataStr;
console.log(url)
}
</pre>
<script>
//get请求
let url = ‘http://localhost:8081‘
let data = { name: ‘tom‘, age: 25, address: ‘南非‘ };
let dataStr = ‘‘;//拼接字符串
Object.keys(data).forEach(key => {
dataStr += key + ‘=‘ + data[key] + ‘&‘
})
console.log(dataStr)
if (dataStr !== ‘‘) {//拼接字符串
dataStr = dataStr.substring(0, dataStr.lastIndexOf(‘&‘))
url = url + ‘?‘ + dataStr;
console.log(url)
}
</script>
</div>
<h3>五、常用技巧 </h3>
<div>
<pre>
let person = {name:"张三",age:25,address:"深圳",getName:function(){}}
Object.keys(person).map((key)=>{
person[key] // 获取到属性对应的值，做一些处理
})
</pre>
</div>
<h3> 六、Object.values()和Object.keys()是相反的操作，把一个对象的值转换为数组</h3>
<div>
<pre>
let strList = { name: ‘tom‘, age: 25, address: ‘南非‘ };
console.log(Object.values(strList)) //["tom", 25, "南非"]
</pre>
<script>
let strList = { name: ‘tom‘, age: 25, address: ‘南非‘ };
console.log(Object.values(strList)) //["tom", 25, "南非"]
</script>
</div>
<br /> <br /> <br /> <br /> <br /> <br /> <br /> <br /> <br />
<script>
</script>
</body>
</html>
原文：https://www.cnblogs.com/xpf123/p/11678595.html