Sitemap
Madhur Pratap Singh

Madhur Pratap Singh

SDE @Renan

Press enter or click to view image in full size

We will continue our journey of learning javascript, Today lets deep dive in objects.

What objects are?
Objects in javascript are a datatype just like array, string, numbers etc…
Actually first we need to clear concept about type of data types

1. Primitive : String, Number, Boolean, Null, Undefined, Symbol, BigInt
2. Non Primitive: Arrays, Objects, Functions

Primitive data types are immutable and follow call by value. This means when used, the actual value is passed — not the memory reference.
Non Primitive data type follows call by reference — only the memory reference is used, not the actual value.

So, JavaScript objects are non-primitive data types used to store key-value pairs, where the values can be strings, numbers, arrays, other objects, etc.

What they are used for?
They are used for storing key value pair where value can be string, numbers, arrays etc…

Basic Syntax Of Object

Here keys are like name, age, friends and there value is in front of them.

How to Access Object Properties?
By using “.” dot or [“key”] giving key name inside semicolon
Lets see how

Press enter or click to view image in full size

Can we Modify Object Property?
Yes, By assigning them a new value

Modification of Object Properties

Deleting Object Property
using delete keyword : delete objname.propname

Press enter or click to view image in full size
Deleting Property

Nested Objects
they are something like obj inside obj ….
They are destructured using “.”
eg

const user = {
name: “Madhur”,
address: {
city: “Gorakhpur”,
pin: 273001,
},
};
console.log(user.address.city); // “Gorakhpur”

Get Madhur Pratap Singh’s stories in your inbox

Join Medium for free to get updates from this writer.

Lets See Looping through Objects

Looping through Javascript objects

Key points

  1. Rest operator should be in last
  2. Arrow functions do not have their own this, so they inherit this from the outer scope. Regular functions use their own this referring to the object they belong to.

SOME IMP INTERVIEW QUESTION ON THIS TOPIC

  1. Dynamic key values in an object
    let dynamicKey = “age”;
    let dynamicValue = 25;
    let user = {};
    //Add dynamic key-value pair to the object
    user[dynamicKey] = dynamicValue;
    console.log(user);

Ans: It will console log: {age:25}. As a new js object is created herewith the given values

2. const obj = {
a: 1,
b: 2,
a: 3,
}
console.log(obj);

Ans : output will be : { a:3, b:2 }. The object initially has two properties with the same key (a) but different values: first a: 1 and then a: 3. However, in JavaScript, if an object has duplicate keys, the last value for that key will overwrite any previous values.

3. What will be the output?

const obj1 = {};
const obj2 = { key: "b" };
const obj3 = { key: "c" };
obj1[obj2] = 123;
obj1[obj3] = 234;
console.log(obj1[obj2]);

When we try to assign any object as a key inside object. It automatically converts key name as object Object so it overwrites vaklue 234 and returns result as 234.

4. What is JSON.stringify() and JSON.parse() ?

JSON.stringify() is used to serialize JavaScript objects into JSON strings, typically when sending data over a network or storing it.
JSON.parse() is used to deserialize JSON strings back into JavaScript objects, often when receiving data from a server.

5. What will be the output?

const obj1 = { name: "madhur", age: 22};
const obj2 = { alpha: "rule", ...obj1 };
console.log(obj2);

Output will be { alpha: ‘rule’, name: ‘madhur’, age: 22}

6. What will be the output?

console.log({ name: "GFG" } == { name: "GFG" });
console.log({ name: "GFG" } === { name: "GFG" });

Both are false as Both ‘==’ and ‘===’ operators compare objects by reference, not by their content

7.Shallow and deep Copy

A shallow copy creates a new object that shares references to the original object’s nested elements, so changes to those elements affect both objects. A deep copy creates a completely independent copy, duplicating all nested objects to avoid shared references.

--

--