对象解构重命名用冒号语法{原属性名:新变量名},解决命名冲突;支持默认值{a:b=1}和嵌套重命名{u:{n:un}},原属性名须准确匹配,新变量名可任意命名。

对象解构时重命名变量,核心是用 冒号(:)语法 把原属性名和新变量名分开,既保留数据来源的可读性,又彻底避开命名冲突。
重命名的基本写法
语法结构是:{ 原属性名: 新变量名 }。左侧是对象里真实存在的键,右侧是你自由定义的变量名,二者完全解耦。
- 原属性名必须准确匹配,否则取不到值(比如写错大小写或拼写)
- 新变量名可以是任意合法标识符,不受对象键名限制
- 不改变原对象,只是提取+换名赋值
解决常见命名冲突场景
当多个对象有同名属性、或与已有变量/保留字重叠时,重命名最直接有效:
- 多个 API 返回都含
id,但业务中需区分:用{ id: userId }和{ id: postId } - 属性名是保留字如
class或default:写成{ class: className }或{ default: defaultValue } - 函数参数中解构 props,避免覆盖外层同名变量:比如外层有
name,就写{ name: userName }
组合默认值与重命名
重命名和默认值可同时使用,格式为:{ 原属性名: 新变量名 = 默认值 }。注意等号前不能有空格,且默认值只在属性值为 undefined 时生效。
const { title: pageTitle = '首页', status: pageStatus = 'draft' } = data;- 若
data.title是undefined,pageTitle就取'首页';若是null或'',仍保持原值
嵌套对象中的重命名
重命名支持逐层嵌套,只需在对应层级的解构模式中使用冒号即可:
const { user: { name: userName, email: contactEmail } } = response;- 也可混合默认值:
const { config: { timeout: requestTimeout = 5000 } } = settings; - 注意:每级花括号内都遵循“属性名: 变量名”规则,不可跨层简写


















