# Understanding Objects in Javascript

### **What objects are and why they are needed?**

Objects are used to store keyed collections of various data and more complex entities. An object can be created with curly braces {...} with an optimal list of properties. A property is a "key:value" pair, where key is a string and value can be anything.

An empty object can be created using one of two syntaxes:

```plaintext
let user = new Object(); // "object constructor" syntax
let user = {}; // "Object literal" syntax
```

A property has a key before the colon and value to the right of it.

```javascript
let user = {
   name : "John",
   age : 30,
};
```

## Accessing properties

Property values are accessible using the dot notation. The dot requires the key to be a valid variable identifier. That implies: contains no spaces, doesn’t start with a digit and doesn’t include special characters (`$` and `_` are allowed).

```javascript
console.log(user.name);
console.log(user.age);
```

For multiword properties , dot notation does not work. Use square bracket notation that works with any string.

```javascript
user["likes birds"] = true;
console.log(user["likes birds"]);
```

We can use square brackets in an object literal , when creating an object. That is called computed properties.

```javascript
let value = prompt("Write any friend's name?" , "ram");
let bag = {
   [value]: 45
};
console.log(bag.value);
```

Square brackets are much more powerful than dot notation. They allow any property names and variables.

## Adding and deleting properties

To delete a property , use delete obj.property

```javascript
delete user.age;
```

To add and update any property , we use

```javascript
let user = {};
user.name = "John";
user.surname = "Smith";
user.name = "Pete";
```

## Looping through object keys

To iterate over an object -

```javascript
let codes = {
  "+49": "Germany",
  "+41": "Switzerland",
  "+44": "Great Britain",
  "+1": "USA"
};

for (let code in codes) {
  console.log( code ); // 49, 41, 44, 1
}
```

## Cloning and merging , Object.assign

A variable stores not the object value ,but a reference for the value. So, Copying an object variables creates one more reference to the same object. We can create a new object and replicate the structure of existing one , by iterating over its properties and copying them on the primitive level.

```javascript
let user = {
  name : "John",
  age : 30
}
let clone = {};
for (let key in user){
  clone[key] = user[key];
}
```

We can also use the method Object.assign.

The syntax is:

```javascript
Object.assign(dest, ...sources)
```

*   The first argument `dest` is a target object.
    
*   Further arguments is a list of source objects.
    

It copies the properties of all source objects into the target `dest`, and then returns it as the result.

The call `structuredClone(object)` clones the `object` with all nested properties. The `structuredClone` method can clone most data types, such as objects, arrays, primitive values.

It also supports circular references, when an object property references the object itself (directly or via a chain or references).

```javascript
let user = {};
// let's create a circular reference:
// user.me references the user itself
user.me = user;

let clone = structuredClone(user);
console.log(clone.me === clone); // true
```