How to thaw/defrost a frozen object in Javascript? [duplicate]

Question

Could you please show me how to defrost a frozen object in Javascript, so that I will be able to modify its properties?

var pizza = {
    name: 'Peri Peri',
    Topping: 'Prawn'
};

Object.freeze(pizza);

// Can't change the name of the object because it's frozen
pizza.name = 'Hawaiian';

Answer 1

Technically, Object.freeze makes an object immutable. Quoting from that page,

Nothing can be added to or removed from the properties set of a frozen object. Any attempt to do so will fail, either silently or by throwing a TypeError exception (most commonly, but not exclusively, when in strict mode).

Values cannot be changed for data properties. Accessor properties (getters and setters) work the same (and still give the illusion that you are changing the value). Note that values that are objects can still be modified, unless they are also frozen.

So, the only way this could be done is, by cloning the object

var pizza = {
    name: 'Peri Peri',
    Topping: 'Prawn'
};

Object.freeze(pizza);
pizza.name = 'Hawaiian';
console.log(pizza);
// { name: 'Peri Peri', Topping: 'Prawn' }

pizza = JSON.parse(JSON.stringify(pizza));  // Clones the object

pizza.name = 'Hawaiian';
console.log(pizza);
// { name: 'Hawaiian', Topping: 'Prawn' }

Note 1: In strict mode, it will NOT fail silently and throw an Error instead

"use strict";
...
...
pizza.name = 'Hawaiian';
           ^
TypeError: Cannot assign to read only property 'name' of #<Object>

Note 2: If your object has methods, then JSON.stringify approach will NOT get them. You can read more about properly cloning the objects in these three questions.