JavaScript objects are collections of key-value pairs used to store and organize data. They are flexible and mutable, and also form the basis of JSON, which is widely used for data exchange.
- Store data as key-value pairs, where keys are strings or symbols.
- Are mutable, allowing properties to be added, updated, or deleted at runtime.
- Support features like methods, destructuring, spread syntax (...), and dynamic property access.
1. Are Key-Value Pairs
In JavaScript, an object is a collection of properties, where each property is a key-value pair. The key is always a string (or can be converted to a string), and the value can be any valid JavaScript data type, such as a string, number, array, or even another object.
let obj = { name: "John", age: 30 };
console.log(obj.name);
console.log(obj['age']);
2. Objects Are Mutable
Objects in JavaScript are mutable, meaning you can modify their properties after creation.
let obj = { name: "John", age: 30 };
obj.age = 31;
obj.city = "New York";
delete obj.name;
console.log(obj);
3. Objects Can Have Functions as Values
Objects in JavaScript can store functions as methods, which can be used to define behavior along with data.
let obj = {
name: "John",
greet: function() {
console.log("Hello, " + this.name);
}
};
obj.greet();
4. Objects Can Have Computed Property Names
With ES6, you can use computed property names in objects. This allows you to dynamically set property names.
let key = "age";
let obj = { [key]: 30 };
console.log(obj.age);
5. Objects and Arrays Are Different, But Arrays Are Objects
Objects and arrays are both used to store collections of data in JavaScript, but they work differently. Objects store data using named keys, while arrays store data using numeric indexes. Interestingly, arrays are actually specialized objects with additional features like the length property and built-in array methods.
let obj = { name: "John", age: 30 };
let arr = [10, 20, 30];
console.log(obj instanceof Object);
console.log(arr instanceof Object);
console.log(arr instanceof Array);
console.log(typeof obj);
console.log(typeof arr);
Both obj and arr are objects in JavaScript. However, arr is also an Array instance, which provides indexed access and built-in methods like push(), pop(), and map().
6. JavaScript Arrays are Objects
JavaScript arrays are actually specialized objects, with indexed keys and special properties. They have a length property and are technically instances of the Array constructor.
const a = [10, 20, 30];
console.log(typeof a);
7. Objects Can Be Nested
Objects in JavaScript can be nested within other objects, creating complex data structures.
let obj = {
name: "John",
address: {
city: "New York",
zip: "10001"
}
};
console.log(obj.address.city);
8. Prototype Inheritance
Every JavaScript object has a prototype from which it can inherit properties. This allows for inheritance in objects.
let animal = { eats: true };
let obj = Object.create(animal);
obj.barks = true;
console.log(obj.eats);
console.log(obj.barks);
9. Object Destructuring
With ES6, JavaScript allows you to easily extract values from an object using destructuring syntax.
let obj = { name: "John", age: 30 };
let { name, age } = obj;
console.log(name);
console.log(age);
10. Objects Have Built-In Methods
JavaScript provides several built-in methods for working with objects, such as Object.keys(), Object.values(), and Object.entries().
let obj = { name: "John", age: 30 };
console.log(Object.keys(obj));
console.log(Object.values(obj));
console.log(Object.entries(obj));
11. The this Keyword in Objects
The this keyword refers to the calling context of the function, which is often the object when used as a method. It helps you access the object's properties.
let obj = {
name: "John",
greet: function() {
console.log("Hello, " + this.name);
}
};
obj.greet();
12. Object.freeze()
You can use Object.freeze() to make an object immutable. This prevents adding, removing, or modifying its properties.
let obj = { name: "John", age: 30 };
Object.freeze(obj);
obj.age = 31;
console.log(obj.age);
13. The in Operator
The in operator checks whether a property exists in an object (including inherited properties from the prototype chain).
let obj = { name: "John", age: 30 };
console.log("name" in obj);
console.log("address" in obj);
