Group a Student Record

An object groups named properties. A second variable assigned that object refers to the same object, so an update through either name is observable through the other.

Before this topic, review Choose a Method's Receiver if its terms are unfamiliar.

This is JavaScript using language features and the host console. Read the initial values, then follow each operation to its displayed result. A declaration names a value, a function call performs an operation, and console.log displays its arguments.

This diagram follows the supplied example. It is an explanatory model, not a JavaScript engine or a timing guarantee.

In JavaScript, objects are everywhere. From storing user data to building APIs or handling events—objects hold key-value pairs that power the language. If you're aiming to build interactive websites or master frameworks like React or Node.js, understanding objects is non-negotiable.

A JavaScript object is a collection of properties, where each property is a key-value pair. Think of it as a dictionary or real-world entity, like a car or a person.

const car = {
  brand: "Toyota",
  model: "Corolla",
  year: 2021
};

{ brand: "Toyota", model: "Corolla", year: 2021 }

1. Using Object Literals

const user = {
  name: "Alice",
  age: 25,
  isMember: true
};

2. Using the Object Constructor

const user = new Object();
user.name = "Bob";
user.age = 30;

3. Using a Function Constructor

function User(name, age) {
  this.name = name;
  this.age = age;
}
const user1 = new User("Charlie", 28);

You can access object properties in two ways:

console.log(user.name); // Dot notation
console.log(user["age"]); // Bracket notation

user.age = 26;       // Modify
user.city = "Paris"; // Add

{ name: "Alice", age: 26, isMember: true, city: "Paris" }

delete user.city;

const person = {
  name: "David",
  contact: {
    email: "david@example.com",
    phone: "1234567890"
  }
};
console.log(person.contact.email);

"david@example.com"

Objects can contain functions as values called methods.

const calculator = {
  add: function(x, y) {
    return x + y;
  }
};
console.log(calculator.add(5, 3));

8

The this keyword refers to the object from which the method was called.

const profile = {
  username: "techie",
  showUsername: function() {
    return this.username;
  }
};
console.log(profile.showUsername());

"techie"

Using for...in loop

for (let key in user) {
  console.log(key + ": " + user[key]);
}

• Object.keys(obj) – returns all property names
• Object.values(obj) – returns all values
• Object.entries(obj) – returns an array of [key, value] pairs

console.log(Object.keys(user));
console.log(Object.values(user));
console.log(Object.entries(user));

"userId" in user; // false
user.hasOwnProperty("age"); // true

const { name, age } = user;
console.log(name, age);

"Alice", 26

1. Using Object.assign()

const original = { a: 1 };
const clone = Object.assign({}, original);

2. Using Spread Operator

const newClone = { ...original };

• Object.freeze(obj) – Prevents adding/removing/modifying properties
• Object.seal(obj) – Prevents adding/removing but allows modifying existing

Object.freeze(user);
user.name = "Eve"; // Won’t work
console.log(user.name);

"Alice"

JavaScript objects are powerful and versatile. They serve as the foundation for JSON, API calls, configurations, and complex data models. Mastering object manipulation is key to advancing in any JS-based role or framework.

In the upcoming modules, you’ll dive into arrays, which are object-like structures perfect for ordered data. Once you pair them with objects, your JavaScript fluency takes a huge leap forward.

const protects the binding, not the fields. Use an intentional copy when you need independent data; spread makes only a shallow copy.

Your task: Replace same.marks = 72 with same.marks = 80. Predict the result before running the edited program.

The source is repeated here. If the edit targets the HTML rather than the script, use the markup repeated below; the worked answer also repeats the changed markup.

Both names access the same record, whose mark is updated to 80.

An object groups named properties. A second variable assigned that object refers to the same object, so an update through either name is observable through the other.

Check your variation against this explanation: Both names access the same record, whose mark is updated to 80.

Use the JavaScript array reference library for individual array operations and boundary tests to check a rule independently.