Skip to content

18. JavaScript Objects.md

Latest commit

 

History

History
271 lines (226 loc) · 5.6 KB

18. JavaScript Objects.md

File metadata and controls

271 lines (226 loc) · 5.6 KB

JavaScript Objects

JavaScript objects are a fundamental data structure that allows you to store and manipulate data as key-value pairs. Objects are versatile and are used to represent and organize data in a structured way. They are at the core of the JavaScript language and are used for a wide range of purposes.

Here's an overview of JavaScript objects, including their syntax, properties, methods, and examples:

Creating Objects

In JavaScript, objects can be created in several ways:

1. Object Literal

The simplest way to create an object is using object literal notation:

const person = {
    firstName: "John",
    lastName: "Doe",
    age: 30,
    isStudent: false
};

2. Object Constructor

You can also create objects using the Object constructor:

const car = new Object();
car.make = "Toyota";
car.model = "Camry";
car.year = 2020;

3. Object.create() Method

The Object.create() method allows you to create a new object with the specified prototype object:

const animal = {
    type: "Mammal",
    sound: "Roar"
};

const lion = Object.create(animal);
lion.name = "Simba";

Accessing Object Properties

You can access object properties using dot notation or bracket notation:

console.log(person.firstName); // "John"
console.log(car["make"]); // "Toyota"

Modifying Object Properties

You can change the values of object properties by assigning new values:

person.age = 31;
car["year"] = 2022;

Adding New Properties

You can add new properties to an object:

person.city = "New York";
car.color = "Blue";

Deleting Properties

You can delete properties from an object using the delete operator:

delete person.isStudent;
delete car["model"];

Object Methods

Objects can also contain methods, which are functions defined as object properties. Methods allow you to define actions or behaviors associated with an object:

const calculator = {
    add: function(a, b) {
        return a + b;
    },
    subtract: function(a, b) {
        return a - b;
    }
};

console.log(calculator.add(5, 3)); // 8
console.log(calculator.subtract(8, 2)); // 6

Object Properties and Methods

JavaScript objects can contain a combination of properties and methods:

const student = {
    firstName: "Alice",
    lastName: "Smith",
    age: 20,
    greet: function() {
        console.log(`Hello, I'm ${this.firstName} ${this.lastName}.`);
    }
};

student.greet(); // "Hello, I'm Alice Smith."

Object Iteration

You can loop through object properties using a for...in loop or the Object.keys(), Object.values(), and Object.entries() methods:

for (let key in person) {
    console.log(key, person[key]);
}

const keys = Object.keys(person);
const values = Object.values(person);
const entries = Object.entries(person);

JavaScript objects are a powerful and flexible way to store and manipulate data in your programs. They are used extensively in web development for representing various entities, such as data structures, configurations, and more. Understanding how to work with objects is essential for effective JavaScript programming.

const person = {
    name: "John",
    age: 20,
};
console.log(person);

Output

{name: "John", age: 20}

To find Type

const person = { 
    name: "John",
    age: 20,
};
console.log(person);
console.log(typeof(person));

Output

{name: "John", age: 20}
object

Accessing Object Properties

Using dot notation

const person = { 
    name: "John", 
    age: 20,
};
console.log(person.name);
console.log(person.age);

Output

John
20

Change the value of an object

const person = { 
    name: "John", 
    age: 20,
    student: true
};
console.log(person.name);
console.log(person.age);

person.age = 29;
console.log(person.age);

Output

John
20
29

Using bracket notation

const person = { 
    name: "John", 
    age: 20,
};
console.log(person["name"]);
console.log(person["age"]);

Output

John
20

Object Methods

const person = {
    name: "John",
    age: 30,
    greet: function() { console.log('hello') }
}
person.greet();

Output

hello

Assignment and Task

Can you create an object named student with keys name, rollNo, totalMarks. Give any values you prefer. Also, create two functions: first function to print the information about the student and a second function to check if the student passed the exam or not. If the totalMarks is less than 40, print 'You failed'. If the totalMarks is greater than or equal to 40, print 'You passed'.

Solution:

const student = {
    name: 'Jack',
    rollNo: 12,
    total_marks : 40
}

function studentInfo() {
    console.log(student.name);
    console.log(student.rollNo);
    console.log(student.total_marks);
}

function checkResult() {
    if (student.total_marks < 40) {
        console.log('You failed.')
    } else {
        console.log('You passed.')
    }
}

studentInfo();
checkResult();

Output

Jack
12
40
You passed.

p4n Quiz

Q. What is the correct way to call this access the object value name?

const student = {
    name: "Sarah",
    class: 10
}
  1. student[name]
  2. student.name
  3. student.name()
  4. student"name"

Answer: 2