javascript对象解构重命名用{原名:新名}语法,支持默认值、嵌套及函数参数;数组解构不支持直接重命名,需间接实现。

JavaScript 中解构赋值重命名变量,是通过 冒号语法 实现的:在解构时,左边写 原属性名: 新变量名,就能把对象属性的值赋给一个不同名字的变量。
对象解构中重命名变量
当从对象中提取属性并想换个变量名时,用 { originalProp: newName } 的形式:
-
const { name: fullName, age: userAge } = { name: 'Alice', age: 30 };
此时fullName的值是'Alice',userAge是30 - 重命名和默认值可以共存:
const { title: bookTitle = 'Untitled' } = {};,bookTitle会取默认值 - 也可以同时解构多个字段,部分重命名、部分保持原名:
const { id, status, createdAt: created } = data;
数组解构中不能直接重命名,但可间接实现
数组解构按索引位置赋值,本身不支持像对象那样的冒号重命名。但可以通过以下方式“等效”重命名:
- 用逗号跳过不需要的项,再用变量名接收目标位置的值:
const [, , thirdItem] = ['a', 'b', 'c'];→thirdItem是'c' - 结合对象解构“转换”一下:
const [a, b, c] = arr; const { 2: third } = { 0: a, 1: b, 2: c };(不推荐,仅说明逻辑) - 更实用的方式是先解构成临时变量,再用新名字赋值:
const [, , temp] = arr; const thirdElement = temp;
嵌套解构 + 重命名一起用
可以在嵌套结构里对任意一层的属性重命名:
-
const { user: { name: userName, profile: { avatar: avatarUrl } } } = response;
从response.user.name取值给userName,从response.user.profile.avatar给avatarUrl - 支持默认值和重命名组合:
const { config: { timeout: timeoutMs = 5000 } = {} } = data;
函数参数中解构重命名
函数形参也支持解构和重命名,让接口更清晰:
function greet({ name: firstName, age: userAge }) { console.log(`Hi ${firstName}, ${userAge} years old`); }- 调用时传对象:
greet({ name: 'Bob', age: 25 });→ 输出Hi Bob, 25 years old - 同样支持默认值:
function connect({ host: serverHost = 'localhost', port: serverPort = 3000 }) { ... }
Java免费学习笔记:立即使用
解锁 Java 大师之旅:从入门到精通的终极指南











