24个JavaScript循环遍历方法,你都知道吗?( 四 )


reduce()、reduceRight()

reduce()对数组正序操作;reduceRight()对数组逆序操作
keys()、values()、entries()

keys() 返回数组的索引值;values() 返回数组元素;entries() 返回数组的键值对 。
二、对象遍历方法1. for infor…in 主要用于循环对象属性 。循环中的代码每执行一次 , 就会对对象的属性进行一次操作 。其语法如下:
 
 for (var in object) { 执行的代码块} 
其中两个参数:

  • var:必须 。指定的变量可以是数组元素 , 也可以是对象的属性 。
  • object:必须 。指定迭代的的对象 。
 
var obj = {a: 1, b: 2, c: 3};for (var i in obj) {console.log('键名:', i);console.log('键值:', obj[i]); } 
输出结果:
 
键名: a键值: 1键名: b键值: 2键名: c键值: 3 
注意:
  • for in 方法不仅会遍历当前的对象所有的可枚举属性 , 还会遍历其原型链上的属性 。
2. Object.keys()、Object.values()、Object.entries()这三个方法都用来遍历对象 , 它会返回一个由给定对象的自身可枚举属性(不含继承的和Symbol属性)组成的数组 , 数组元素的排列顺序和正常循环遍历该对象时返回的顺序一致 , 这个三个元素返回的值分别如下:
  • Object.keys():返回包含对象键名的数组;
  • Object.values():返回包含对象键值的数组;
  • Object.entries():返回包含对象键名和键值的数组 。
 
let obj = {id: 1,name: 'hello',age: 18 };console.log(Object.keys(obj));// 输出结果: ['id', 'name', 'age']console.log(Object.values(obj)); // 输出结果: [1, 'hello', 18]console.log(Object.entries(obj));// 输出结果: [['id', 1], ['name', 'hello'], ['age', 18]注意
  • Object.keys()方法返回的数组中的值都是字符串 , 也就是说不是字符串的key值会转化为字符串 。
  • 结果数组中的属性值都是对象本身可枚举的属性 , 不包括继承来的属性 。
3. Object.getOwnPropertyNames()Object.getOwnPropertyNames()方法与Object.keys()类似 , 也是接受一个对象作为参数 , 返回一个数组 , 包含了该对象自身的所有属性名 。但它能返回不可枚举的属性 。
 
let a = ['Hello', 'World']; Object.keys(a) // ["0", "1"]Object.getOwnPropertyNames(a) // ["0", "1", "length"] 
这两个方法都可以用来计算对象中属性的个数:
 
var obj = { 0: "a", 1: "b", 2: "c"};Object.getOwnPropertyNames(obj) // ["0", "1", "2"]Object.keys(obj).length // 3Object.getOwnPropertyNames(obj).length // 3 
4. Object.getOwnPropertySymbols()Object.getOwnPropertySymbols() 方法返回对象自身的 Symbol 属性组成的数组 , 不包括字符串属性:
 
let obj = {a: 1}// 给对象添加一个不可枚举的 Symbol 属性Object.defineProperties(obj, { [Symbol('baz')]: {value: 'Symbol baz',enumerable: false }}) // 给对象添加一个可枚举的 Symbol 属性obj[Symbol('foo')] = 'Symbol foo' Object.getOwnPropertySymbols(obj).forEach((key) => { console.log(obj[key]) })// 输出结果:Symbol baz Symbol foo 
5. Reflect.ownKeys()Reflect.ownKeys() 返回一个数组 , 包含对象自身的所有属性 。它和Object.keys()类似 , Object.keys()返回属性key , 但不包括不可枚举的属性 , 而Reflect.ownKeys()会返回所有属性key:
 
var obj = { a: 1, b: 2}Object.defineProperty(obj, 'method', { value: function () {alert("Non enumerable property") }, enumerable: false})console.log(Object.keys(obj))// ["a", "b"]console.log(Reflect.ownKeys(obj))// ["a", "b", "method"] 
注意: