This content originally appeared on DEV Community and was authored by Usama
✨ Shorthand Property
When the key and the variable name are the same in an object,
you don’t need to repeat them.
âś… Example:
let name = "Usama";
let age = 22;
const user = {
name, // shorthand for name: name
age // shorthand for age: age
};
console.log(user);
// { name: "Usama", age: 22 }
`
👉 This makes code cleaner and less repetitive.
🤖 Computed Property
Sometimes you want to dynamically set object keys.
You can use square brackets [] inside an object to compute the key.
âś… Example:
`js
let key = "email";
const user = {
name: "Usama",
[key]: "usama@example.com" // computed property
};
console.log(user);
// { name: "Usama", email: "usama@example.com" }
`
👉 Here, the key is calculated at runtime.
🚀 Quick Recap
- ✨ Shorthand Property → Removes repetition (
name, age) - 🤖 Computed Property → Allows dynamic keys (
[key]: value)
Both make your code shorter, cleaner, and smarter 🎯
💡 What’s your favorite JavaScript shorthand trick? Drop it in the comments! 🙌
`
This content originally appeared on DEV Community and was authored by Usama
Usama | Sciencx (2025-09-02T16:02:31+00:00) 🤖 Computed Property & ✨ Shorthand Property in JavaScript. Retrieved from https://www.scien.cx/2025/09/02/%f0%9f%a4%96-computed-property-%e2%9c%a8-shorthand-property-in-javascript-2/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.