Creating new objects from frozen parent objects

Question

This example creates an object, freezes it, and then creates a new object from the frozen object. If the second object tries to change the test property, it can\'t. It remai

Answer 1

In new versions of javascript you can use object destructuring to create a new object with the properties of the old one.

const first = {
    test: 10
};
Object.freeze(first);

//Clone the object
const second = {...first};
second.test = 20;
console.log(second.test); // 20 where the first is locked

Answer 2

Use Object.assign

         var first = {
            test: 10
        };
        Object.freeze(first);

        //Create a second object from the first one and
        //try and change the new test property (you can't)

        var second = Object.assign({}, first, {
            test: 20
        });
        console.log(second.test); //20

Answer 3

second is in fact a new object, with first being the prototype of second. The reason why

second.test = 20;

does not work is because upon assignment, it will look for the settings on the prototype (i.e. configurable, enumerable, writable, [[Extensible]]) and not assign to the instance if any of these are false¹. To assign directly to the instance, you'll have to use Object.defineProperty on second:

var first = {
    test: 10
};
Object.freeze(first);

var second = Object.create(first);
Object.defineProperty(second, 'test', { value: 20, enumerable: true, configurable: true, writable: true });
console.log(second.test); // 20

^1: [[Put]]: the ECMAScript Specification, §8.12.5

Answer 4

In your case second is a reference to first (like you assumed). A solution would be to clone your object. There is no build in way to clone objects - you have to do it yourself, here is how (source):

function clone(obj){
   if(obj == null || typeof(obj) != 'object')
      return obj;

   var temp = obj.constructor();

   for(var key in obj)
       temp[key] = clone(obj[key]);
   return temp;
}

Then you use it this way:

var first = {
    test: 10
};
Object.freeze(first);

// clone it into a new one
var second = clone(first);
second.test = 20;
console.log(second.test); // 20 where the first is locked