JS 对象遍历方式总结

for…in…

// Object 原型链上扩展的方法也会被遍历出来
Object.prototype.fun = () => {
    
    };
const obj = {
    
     name: '张三', age: 18 };
for (const i in obj) {
    
    
  console.log(i);
} 
// name age fun

//如果只需要获取对象的实例属性，可以使用 hasOwnProperty 进行过滤。
Object.prototype.fun = () => {
    
    };
const obj = {
    
     name: '张三', age: 18 };
for (const i in obj) {
    
    
  if (Object.prototype.hasOwnProperty.call(obj, i)) {
    
    
    console.log(i, ':', obj[i]);    
  }
} 
// name,:,张三 age,:,18

Object.keys

//用于获取对象自身所有的可枚举的属性值，但不包括原型中的属性，然后返回一个由属性名组成的数组。
Object.prototype.fun = () => {
    
    };

const str = 'HelloWorld';
console.log(Object.keys(str));
// ["0", "1", "2", "3", "4", "5", "6", "7", "8", "9"]
const obj = {
    
     name: '张三', age: 18 };
console.log(Object.keys(obj));
// ["name", "age"]

Object.values

//用于获取对象自身所有的可枚举的属性值，但不包括原型中的属性，然后返回一个由属性值组成的数组。
Object.prototype.fun = () => {
    
    };

const str = 'HelloWorld';
console.log(Object.values(str));
//  ["H","e","l","l","o","W","o","r","l","d"]
const obj = {
    
     name: '张三', age: 18 };
console.log(Object.values(obj));
//  ["张三",18]

Object.entries

//用于获取对象自身所有的可枚举的属性值，但不包括原型中的属性，然后返回二维数组。每一个子数组由对象的属性名、属性值组成。
const str = 'hello';
for (const [key, value] of Object.entries(str)) {
    
        
  console.log(`${
      
      key}: ${
      
      value}`);
}
// 0: h
// 1: e
// 2: l
// 3: l
// 4: o

const obj = {
    
     name: '张三', age: 18 };
for (const [key, value] of Object.entries(obj)) {
    
        
  console.log(`${
      
      key}: ${
      
      value}`);
}
// name: 张三
// age: 18

Object.getOwnPropertyNames

//用于获取对象自身所有的可枚举/不可枚举的属性值（不包括 Symbol 值作为名称的属性），但不包括原型中的属性，然后返回一个由属性名组成的数组。

const str = 'hello'
console.log(Object.getOwnPropertyNames(str));
// ["0", "1", "2", "3", "4", "length"]

const obj = {
    
     name: '张三', age: 18 };
const symbol1 = Symbol('symbol1')
const symbol2 = Symbol('symbol2')
obj[symbol1] = 'hello'
obj[symbol2] = 'world'
console.log(Object.getOwnPropertyNames(obj));
// ["name", "age"]

Object.getOwnPropertySymbols()

//用于获取指定对象的所有 Symbol 属性名。该方法返回一个数组，成员是当前对象的所有用作属性名的 Symbol 值。
const obj = {
    
     name: '张三', age: 18 };
const symbol1 = Symbol('symbol1')
const symbol2 = Symbol('symbol2')
obj[symbol1] = 'hello'
obj[symbol2] = 'world'
console.log(Object.getOwnPropertySymbols(obj));
// [Symbol(symbol1), Symbol(symbol2)]

Reflect.ownKeys()

//返回一个数组，包含对象自身的所有属性，不管是属性名是 Symbol 或字符串，也不管是否可枚举,但不包括原型中的属性。

const obj = {
    
     name: '张三', age: 18 };
const symbol1 = Symbol('symbol1')
const symbol2 = Symbol('symbol2')
obj[symbol1] = 'hello'
obj[symbol2] = 'world'
console.log(Reflect.ownKeys(obj));
// ["name", "age", Symbol(symbol1), Symbol(symbol2)]