Rename on Destructure
Use key: newName to import a property under a different variable name, avoiding naming conflicts.
JavaScript
Beginner
3 min read
Renaming Destructured Variables
Example
const { data: userData, error: fetchError } = await getUser(id);
// Property "data" is now "userData", "error" is "fetchError"
// Rename + default combined
const { timeout: requestTimeout = 5000, retries: maxRetries = 3 } = config;
// Useful when two sources have same key name
const { id: userId } = user;
const { id: postId } = post; Pro Tip
Renaming is syntax sugar — the original object is untouched.
Related Resources
JavaScript Reference
Complete tag & property list
JavaScript How-To Guides
Step-by-step practical guides
JavaScript Exercises
Practice what you've learned
More in JavaScript