Objects in JavaScript

What is object?

In JavaScript, objects are a fundamental data structure used to store collections of data and more complex entities. An object is a collection of key-value pairs, where the key (also called a property name) is a string (or Symbol) and the value can be of any data type, including other objects, functions, arrays, or primitive types like numbers, strings, or booleans.

Ways to create an object:-

Object literals

This is the most common and simple way to create an object.

const person = { 
        name: "Vitthal", 
        age: 24, 
        occupation: "Developer", 
        isMarried:true, 
        mail:'korvanvitthal@gmail.com' 
    };

New Keyword

This is a more verbose way of creating objects, but it is functionally the same as using object literals.

const person = new Object(); 
  //-> Constructor means a function which has same class name
    person.name = "Vitthal";
    person.age = 24;
    person.occupation = "Developer";

Object.create()

 const person = Object.create(null);
    person.name = "Vitthal";
    person.age = 30;
    person.occupation = "Developer";
    console.log(person);

Accessing the element:-

Dot Notation

Access or modify properties using . syntax.

const person = { name: "Vitthal", age: 24, occupation: "Developer" };
  console.log(person.name); // "Vitthal"
  person.name = "June";
  console.log(person.name); // "June"

Bracket(square) Notation

Useful when property names have spaces or are dynamic.

const person = { name: "Vitthal", age: 24, occupation: "Developer" };
console.log(person["name"]); // "Vitthal"
person["name"] = "july";
console.log(person["name"]); // "july"

Object.asign()

The Object.assign() method in JavaScript is used to copy the values of all enumerable own properties from one or more source objects to a target object. It is useful for merging objects or cloning objects in a shallow manner.

const target = { a: 1, b: 2 };
const source = { b: 4, c: 3 };

const result = Object.assign(target, source);

console.log(result);  // Output: { a: 1, b: 4, c: 3 }

Object destructing with rest operator:-

Object destructuring with the rest operator allows you to extract properties from an object and group the remaining properties into a new object. Here's an example:

const person = { name: 'Vitthal', age: 24, occupation: 'Developer', 
hobbies: ['coding', 'reading'] };

const { name, age, ...rest } = person;

console.log(name); // "Vitthal"
console.log(age); // 24

Spread operator in Objects:-

The spread operator (...) in JavaScript is used to copy or expand objects and arrays. When applied to objects, it allows you to create shallow copies or merge objects together by expanding their properties into a new object. This operator was introduced in ES6 (ECMAScript 2015).

const obj1 = { a: 1, b: 2 };
const obj2 = { c: 3, d: 4 };

const newObj = { ...obj1, ...obj2 };

console.log(newObj); // { a: 1, b: 2, c: 3, d: 4 }

overriding properties

const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };

const newObj = { ...obj1, ...obj2, person:{name:'vitthal', age:24} };

console.log(newObj); 
// { a: 1, b: 3, c: 4, person: { name: 'vitthal', age: 24 } }