React 学习笔记 7 （React.createElement简单实现）

1.什么是React元素

是React应用的最小单位，它描述了你在屏幕上看到的内容，React元素的本质是一个普通的JS对象，ReactDOM会保证浏览器中的DOM和你的React元素一致。

2.使用babel转化生产元素的背后故事

class Component{
    static isReactComponent = true
    constructor(props){
        this.props = props;
    }
}
function ReactElement(type,props){
  const element = {type,props};
  return element;
}
function createElement(type,config={},children){
    let propName;
    const props = {};
    for(propName in config){
        props[propName] = config[propName];
    }
    
    const childrenLength = arguments.length - 2;
    // 字符串的处理
    if(childrenLength==1){
        props.children = children;
    }else if(childrenLength>1){
        // 多个children
        props.children = Array.from(arguments).slice(2);
    }
    
    return ReactElement(type,props);
}
export default {createElement,Component};