Object.keys()的使用方法及数组遍历
Object.keys()用于获得由对象属性名组成的数组,可与数组遍历相结合使用,非常好用。和for...in方法功能类似,但有使用区别!
数组遍历可以用for()或forEach()来实现,forEach()方法是ECMAScript5定义的遍历数组的一个新方法,按照索引的顺序挨个传递给定义的函数;
接下来就Object.keys()分别结合for()和forEach()使用进行运用,用console.info()输出到控制台,代码如下:
方法一:forEach()
// 创建对象 var person = { name: 'hjm', age: 18, school:"SKD University", home: 'China' } // 用forEach()进行遍历 var keys = Object.keys(person).forEach(function (e) { console.log("person ", e, ": ", person[e]); });
运行的结果如下图所示:
方法二:for()方法
// 创建一个对象 var person = { name: 'hjm', age: 18, school:"SKD University", home: 'China' } // 获得对象属性名组成的数组 var keys = Object.keys(person); // 用于存储匹配的属性值 var value = []; // 用for进行遍历 for (var i = 0,len = keys.length; i < len; i++) { var key = keys[i]; value[i] = person[key]; console.log("person ", key, ": ", value[i]); }
运行的结果如下图所示:
两种方法的结果是一样的,至于使用哪种方法,就智者见智,仁者见仁了。
for():用起来比较容易上手,但太罗嗦;
forEach():和相关的遍历方法结合,使得数组拥有简单而强大的函数式编程风格,更加强大。
Tips:for...in会遍历整个原型链,这可能不是你所期望的结果,然后从性能角度上看Object.keys会更优。在一些eslint的规则中也默认禁用了forin循环。
拓展: JS几种数组遍历方式总结(包括各自遍历的性能分析):JS几种数组遍历方式总结_function__的博客-CSDN博客_js 数组遍历