Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
0% found this document useful (0 votes)
3 views

Understanding JavaScript Objects

The document provides a comprehensive guide on JavaScript object creation and manipulation, covering topics such as creating objects, accessing and updating properties, adding and deleting properties, and using methods. It also explains advanced concepts like object destructuring, merging objects, inheritance, and immutability with Object.freeze() and Object.seal(). Additionally, it includes examples of checking property existence, iterating over properties, and working with JSON data.

Uploaded by

nasheetk18
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
3 views

Understanding JavaScript Objects

The document provides a comprehensive guide on JavaScript object creation and manipulation, covering topics such as creating objects, accessing and updating properties, adding and deleting properties, and using methods. It also explains advanced concepts like object destructuring, merging objects, inheritance, and immutability with Object.freeze() and Object.seal(). Additionally, it includes examples of checking property existence, iterating over properties, and working with JSON data.

Uploaded by

nasheetk18
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 8

©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.

in

Basic Object Creation


const car = {
make: "Toyota",
model: "Camry",
year: 2020
};

Explanation: This creates an object named car with three


properties: make, model, and year.

2. Accessing Object Properties


const person = { name: "Alice", age: 30, city: "New
York" };
console.log(person.age); // Output: 30

Explanation: You can access the age property using dot


notation.

3. Updating Object Properties


person.city = "Los Angeles";
console.log(person.city); // Output: Los Angeles

Explanation: You can update the city property by assigning a


new value.

4. Adding New Properties


person.occupation = "Engineer";
console.log(person.occupation); // Output: Engineer

Explanation: You can add a new property to an object by simply


assigning a value to a new key.

©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in


©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in

5. Deleting Properties
delete person.age;
console.log(person.age); // Output: undefined

Explanation: The delete operator removes a property from an


object.

6. Object Methods
const personWithFullName = {
firstName: "John",
lastName: "Doe",
getFullName: function() {
return `${this.firstName}
${this.lastName}`;
}
};
console.log(personWithFullName.getFullName()); //
Output: John Doe

Explanation: This defines a method getFullName that


returns the full name by accessing firstName and
lastName.

©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in


©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in

7. Nested Objects
const student = {
name: "Bob",
age: 20,
grades: {
math: 90,
science: 85,
english: 88
}
};

Explanation: The grades property is an object containing


scores for different subjects.

8. Object Destructuring
const user = { id: 1, username: "john_doe", email:
"john@example.com" };
const { username, email } = user;
console.log(username, email); // Output: john_doe
john@example.com

Explanation: Destructuring allows you to extract properties from


an object into variables.

9. Checking Object Types


const data = {};
console.log(typeof data === 'object'); // Output:
true

Explanation: You can check if a variable is an object using


typeof.

©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in


©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in

10. Object.keys()
const carKeys = Object.keys(car);
console.log(carKeys); // Output: ["make", "model",
"year"]

Explanation: Object.keys() returns an array of the object's


property names.

11. Object.values()
const carValues = Object.values(car);
console.log(carValues); // Output: ["Toyota",
"Camry", 2020]

Explanation: Object.values() returns an array of the


object's property values.

12. Object.entries()
const carEntries = Object.entries(car);
console.log(carEntries); // Output: [["make",
"Toyota"], ["model", "Camry"], ["year", 2020]]

Explanation: Object.entries() returns an array of key-


value pairs.

©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in


©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in

13. Merging Objects


const obj1 = { a: 1, b: 2 };
const obj2 = { b: 3, c: 4 };
const merged = { ...obj1, ...obj2 };
console.log(merged); // Output: { a: 1, b: 3, c: 4
}

Explanation: The spread operator (...) merges two objects,


with properties from the second object overwriting those from
the first.

14. Prototypes
function Animal(type) {
this.type = type;
this.speak = function() {
console.log(`${this.type} makes a sound.`);
};
}
const dog = new Animal("Dog");
dog.speak(); // Output: Dog makes a sound.

Explanation: This defines a constructor function Animal and


creates an instance dog.

©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in


©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in

15. Inheritance
function Dog(breed) {
Animal.call(this, "Dog"); // Call the parent
constructor
this.breed = breed;
}
Dog.prototype = Object.create(Animal.prototype);
const myDog = new Dog("Labrador");
console.log(myDog.type); // Output: Dog
console.log(myDog.breed); // Output: Labrador
myDog.speak(); // Output: Dog makes a sound.

Explanation: The Dog constructor calls the Animal


constructor to inherit the type property. The prototype of Dog
is set to an instance of Animal, allowing myDog to access
methods defined in Animal.

16. Object.freeze()
const frozenObject = Object.freeze({ name: "Alice",
age: 30 });
frozenObject.age = 31; // This will not change the
age property
console.log(frozenObject.age); // Output: 30

Explanation: Object.freeze() makes an object


immutable, meaning you cannot change its properties or add new
ones.

©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in


©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in

17. Object.seal()
const sealedObject = Object.seal({ name: "Bob",
age: 25 });
sealedObject.age = 26; // This will work
sealedObject.city = "New York"; // This will not
work
console.log(sealedObject); // Output: { name:
"Bob", age: 26 }

Explanation: Object.seal() allows existing properties to


be modified but prevents new properties from being added.

18. Checking for Property Existence


if ('occupation' in person) {
console.log("Occupation exists");
} else {
console.log("Occupation does not exist"); //
Output: Occupation does not exist
}

Explanation: The in operator checks if a property exists in an


object.

©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in


©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in

19. Iterating Over Object Properties


for (const key in student) {
if (student.hasOwnProperty(key)) {
console.log(`${key}: ${student[key]}`);
}
}
// Output:
// name: Bob
// age: 20
// grades: [object Object]

Explanation: A for...in loop iterates over the properties of


an object. The hasOwnProperty method ensures that only
the object's own properties are logged.

20. JSON and Objects


const jsonString = JSON.stringify(person);
console.log(jsonString); // Output:
{"name":"Alice","city":"Los
Angeles","occupation":"Engineer"}

const parsedObject = JSON.parse(jsonString);


console.log(parsedObject); // Output: { name:
"Alice", city: "Los Angeles", occupation:
"Engineer" }

Explanation: JSON.stringify() converts an object to a


JSON string, while JSON.parse() converts a JSON string back
into an object.

©️HackNow Call/WhatsApp: +91 8984988593 Visit Us: https://hacknow.co.in

You might also like