Javascript 在对象分解结构中使用冒号

我仍然不熟悉ES6的所有魔力。我在一篇在线文章中看到了这段代码，我不确定

privaterout

是如何分解输入道具的。

component:component

在这种情况下做什么

const PrivateRoute = ({ component: Component, ...rest }) => (
  // Code here
)

我知道我可以这样做来解构一个对象

obj = {firstName: 'John', lastName: 'Doe'};
{first, last} = obj;

并且有

first='John'

，

last='Doe'

；然而，我对示例代码中冒号的引入感到困惑

---

这里有一个指向全文的链接：

这是为通过分解结构获得的属性使用不同的名称

let obj = {
  a: 'thing A',
  b: 'thing B'
}

let { a: newVariable } = obj
console.log(newVariable) // outputs: "thing A"

---

请参见

在解构中使用

：

有两种基本方法：

分解子对象

给变量添加别名

如果

：

的右侧是对象或数组，则您正在分解子对象。如果右侧是一个标识符，则您正在对

：

分解子对象 给变量添加别名 两者合计

---

阅读文档：谢谢你的回答！它比其他的要清楚得多，因为它没有所有额外的React引用。我认为这个答案更好。您的答案需要更正->“…属性的不同名称…”，请将“属性”更改为“键”，因为JS中的属性=键+值对object@vikramvi您要重命名的是作为变量的键/值对，不是键本身。您完全错了，请检查接受的答案“。然后您在…的左侧对键进行了别名”。请澄清为什么需要变量别名？你能给出一些真实世界的例子吗？最常见的例子当然是当你有冲突时，比如

const{a:{value:a}，b:{value:b}}=obj

。在该示例中，

a

和

b

都是具有相同

值

字段的子对象，如果将该值分解两次，则在重新声明名为value的变量两次且类型为

const

时，最终会出现错误。另一个例子就像我上面提到的一样，

组件

是一个

类

的命名约定，您的命名约定规定类应该使用不同的大小写命名，例如

组件

。

const { component: { example } } = opts

// equivalent to
const example = opts.component.example

const { component: Component } = opts

// equivalent to:
const Component = opts.component

const { component: { example: Component } } = opts

// equivalent to
const Component = opts.component.example