转换

本节目标：理解“转换”的核心思路，并能把它用于实际开发或面试表达。 转换JSX； 调用React.createElement() element = React.createElement( "div", { id: "foo" }, React.createElement("a", null, "bar"), React.createElement("b") )

转换成element: function createElement(type, props, ...children) { return { type, props: { ...props, children, }, } } ​ ==createElement("div", null, a, b)== ==returns:==

{
"type": "div",
"props": { "children": [a, b] }
}

其中children总是一个数组

children: children.map(child => typeof child === "object" ? child : createTextElement(child) ),

children有可能为原始值，这种情况调用createTextElement function createTextElement(text) { return { type: "TEXT_ELEMENT", props: { nodeValue: text, children: [], }, } } > 来自 <https://pomb.us/build-your-own-react/>