Objects{}

Javascript objects are dynamic meaning they can change at any point during code execution. When a property is first added to an object JS uses an internal method called [[put]]which creates a spot in the object to store the property.

The result of calling [[put]] is the creation of own property. and when a new value is assigned to an existing property a separate operator called [[set]] takes place which replaces the current property with the new one.

To check if the property exists on an object we can use in . in operator checks for both own property and prototype property. To check only if the given property is own property we can use hasOwnProperty()

console.log("name" in Cat); // true

console.log("toString" in Cat); // true

console.log(Cat.hasOwnProperty('toString')) // false

console.log(Cat.hasOwnProperty('name')) // true

``

To delete a property on a object delete operator is used. delete will always return true each time regardless of whether the property existed or not!

delete Cat.name ; // this will delete the property.

Object property Descriptor

var Cat = {
	name : 'fluffy',
	color : 'white'
}
Object.getOwnPropertyDescriptor(Cat , 'name')
// Object {value: "fluffy", writable: true, enumerable: true, configurable: true}

Writable Attribute

It defines whether the properties value can be changed from it’s initial value. We can change the property attribute using the object define property method

Object.defineProperty(Cat , 'name' , {writable:false})

//Object {value: "fluffy", writable: false, enumerable: true, configurable: true}

Now if we try to change it console will throw an error but only in strict mode.

We change the name property on a object it’s pointing to like this

'name : {first : "fluffy , last : "fluffy"}'

Now we can change the properties on the object even though name property is read only. Since name is really just a pointer. When we make it read only we are only preventing that pointer from being changed.

We can prevent the object form being changes as well

Object.freeze(Cat.name);

Enumerable Attribute

Enumerable means we can loop over the properties of an object using for in loop

Object.defineProperty(Cat , 'name' , {enumerable:false})

There, now notice that even though I’m still looping over all the properties in my cat object that the name property was not actually returned in my loop. That is one of the main use cases for the enumerable property. Setting enumerable to false also makes it so the property does not show up in the object keys. You can look at an object’s keys like this. Now let’s just display that. Notice that object.keys returned an array with all the properties except notice that name is not showing up because it’s not enumerable. If we make name enumerable again, then you can see that it does show up in the object keys. Note that you can still look at the property with bracket notation. So setting enumerable to false does not change the ability to look at the property. You just can’t enumerate it, see it in the object’s keys, or serialize it.

Configurable Attribute

The configurable property locks down a property to prevent certain attributes from being changed. It also prevents the property from being deleted from the object.

Object.defineProperty(Cat , 'name' , {configurable:false})

If configurable is false for a property, you cannot change the enumerable attribute, you cannot change the configurable attribute, and you cannot delete the property. You can, however, change the property’s writable attribute.

getters and setters

Getters and Setters are a couple of pretty cool attributes on a property that allow you to specify the return value of a property using a function and set the value of a property using a function. But you can access the property just like you would any other property.

Object.defineProperty(Cat , 'fullName' ,
{
get:function(){
return this.name.first + " " + this.name.last;
},
set:function(value){
var nameparts = value.split(" ");
this.name.first = nameparts[0];
this.name.last = nameparts[1];
}
});

Extensible

It’s a boolean value that indicates if an object itself can be modified. All the objects that we create are extensible by default meaning new properties and methods can be added any time.By setting it to false we can prevent new properties from being added to an object.

var Cat = {
  name : 'fluffy',
  color : 'white'
}
Object,preventExtensions(Cat);

Now new properties can never be added to the function again.

Sealing Objects

A sealed object is non extensible and non configurable

Object.seal(Cat);

Freezing Objects

A frozen object is where you can not add or remove properties, you can’t change property types and you can’t write to any data properties. In essence a frozen object is a sealed object with data properties are also read only.