Object.getOwnPropertyNames() vs Object.keys()

Differences

  1. Object.getOwnPropertyNames(obj) returns all the properties of the object obj. Object.keys(obj) returns all enumerable properties.
    They provide the same result unless you set enumerable: false to any property.
    In the following example, the screen object has two properties, branch and size.
    const screen = {
    branch: 'Dell',
    size: '27inch',
    };
    Object.getOwnPropertyNames(screen); // ['branch', 'size']
    Object.keys(screen); // ['branch', 'size']
    Let's define one more property named resolution but it is set as enumerable: false:
    Object.defineProperties(screen, {
    resolution: {
    enumerable: false,
    value: '2560 x 1440',
    },
    });
    The resolution property then doesn't appear in the list of Object.keys:
    Object.getOwnPropertyNames(screen); // ['branch', 'size', 'resolution']
    Object.keys(screen); // ['branch', 'size']
  2. For arrays, Object.getOwnPropertyNames includes an extra property named length which is the size of the array.
    const animals = ['dog', 'cat', 'tiger'];
    Object.keys(animals); // ['0', '1', '2']
    Object.getOwnPropertyNames(animals); // ['0', '1', '2', 'length']