我已经看到这种将 Prop 传递给组件的模式:
<Component { ...{ propToPass, anotherProp } } />
相对于:
<Component propToPass={propToPass} anotherProp={anotherProp} />
我想知道实例化一个对象并立即传播内容是否可能会占用内存,或者差异是否可以忽略不计?
请您参考如下方法:
React JSX 通常是用 Babel 进行转换的,你可以在线使用 Babel Playground 看看它编译成什么。
// input
const e1 = <Component { ...{ propToPass, anotherProp } } />
const e2 = <Component propToPass={propToPass} anotherProp={anotherProp} />
// output
"use strict";
var e1 = /*#__PURE__*/React.createElement(Component, {
propToPass: propToPass,
anotherProp: anotherProp
});
var e2 = /*#__PURE__*/React.createElement(Component, {
propToPass: propToPass,
anotherProp: anotherProp
});
他们是一样的!所以你不会看到任何差异。






