Object Spread An Error Results In No Message Property

I'm trying to spread an Error so that I can alter the error without affecting the original error. But the output is an empty object {}. I'm expecting the freeError have at least a

Solution 1:

Object spread only copies enumerable own properties, and at least in some environments, the message is not an enumerable own property.

In Chrome, it's a non-enumerable own property, and in Firefox, it's a property of Error.prototype:

const error = newError('Error test');

// Chrome logs an object (including "enumerable": false,)console.log(Object.getOwnPropertyDescriptor(error, 'message'));

// Firefox logs an object (including "enumerable": false,)console.log(Object.getOwnPropertyDescriptor(Object.getPrototypeOf(error), 'message'));

It's implementation-dependent. I'd manually extract all properties you need:

const error = newError('Error test');
const { message, stack } = error;
const freeError = { message, stack };
console.log(freeError);

Solution 2:

First off, please note that what you are doing is not destructuring - it is called object spread.

Spreading objects only takes ownPropertys into account. Error instances don't have any non-inherited properties. That is why console.log(error) also outputs {}:

const error = newError('Error test');

const freeError = {...error};
console.log(error, freeError);

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error#Properties

Because inherited properties are not part of the spread result object, error does have a message property (inherited from its prototype), whereas freeError does not have it.

Check this example:

const str = newString('Hello world');

const freeStr = { ...str };

console.log(str.length); // 11console.log(freeStr.length); // undefined

As you can see strdoes have a length property (inherited from the Stringprototype), whereas freeStrdoes not have it (for the same reason as in your example).

Again, see MDN here: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Error#Error_instances

Solution 3:

const freeError = {...error};   

is similar to

const freeError = Object.assign({}, error);

If you want to get the properties,

const freeError = Object.assign({message: error.message}, error);