Objects in Javascript for Beginner's

In the world of JavaScript, objects are like magic boxes—special containers that help organize and hold onto our data.

Let's Understand what are javascript

Think of JavaScript objects like folders on your computer. Each folder has a unique name, just like a key in a JavaScript object. Inside these folders, you store different kinds of information—like files! Each file within a folder holds its own set of data.

For instance, imagine a 'Projects' folder. Inside it, you have files for 'Work' and 'Personal'. 'Work' might contain documentation, while 'Personal' could hold list for shopping.

In JavaScript, we can represent it as follows-

// Imagine a JavaScript object representing computer folders and files
const Projects = {
 work:"documentation data",
personal:"shopping list"
};

// Accessing information within the object
console.log(Projects.work); // Outputs: 'documentation data'
console.log(Projects.personal); // Outputs: 'shopping list'

How to Create Objects -

In JavaScript, we create new objects typically using two methods:

1. Literal Way: Imagine crafting a new object like making a fresh recipe card. With the literal way, we directly define an object by using curly braces, like const Projects = {};. It's akin to instantly creating an empty recipe card labeled 'Projects' to fill in with details.

2. Using the 'new' Keyword : This method resembles a more formal process. It involves creating an object by employing the new Object() syntax, like const Projects = new Object();. It's similar to ordering a custom-made recipe card using a specific factory process.

Which is better? Well, the first way, using curly braces {}, is like having a super-fast recipe card generator. It's straightforward and commonly used by everyone. On the other hand, the new Object() method is more formal, a bit longer, and less frequently used in regular coding. Most people prefer the first method—it's simple, clear, and gets the job done smoothly.

If you're curious to learn more about how the new keyword works with user defined constructor functions, freeCodeCamp has an awesome article that explains it really well. It's a great resource to explore for a deeper understanding! - https://www.freecodecamp.org/news/a-complete-guide-to-creating-objects-in-javascript-b0e2450655e8/

Managing Object Properties in JavaScript

Here’s a quick guide on how to add, modify, or delete properties within these objects.

Adding Properties:

Adding a new property to an object is simple. Just assign a value to a new key, and it becomes part of the object.

const person = {
surname = 'Watson'
}; // Creating an object

// Adding more properties to the object
person.name = 'Alice';
person.age = 25;

Modifying Properties:

To change the value of an existing property, access the property and assign a new value.

const person = {
surname: 'watson',
name:'Alice',
age:25
}
person.age = 26;

Deleting Properties:

Removing a property from an object can be done using the delete keyword.

delete person.age

Managing object properties in JavaScript opens up a world of possibilities! Have your own tricks or methods for handling object properties? Share them in the comments below—I'd love to hear and learn from you! Keep an eye out for our next blog—it's going to be even more fun!

Objects in Javascript for Beginner's - 1