<!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