React jsx转换成原生JavaScript的一个例子

jsx代码:

var React = require('react');
var ReactDOM = require('react-dom');
var MyButtonController = require('./components/MyButtonController');

ReactDOM.render(
  <MyButtonController/>,
  document.querySelector('#example')
);
React jsx转换成原生JavaScript的一个例子_第1张图片

转换后的原生JavaScript代码:

React jsx转换成原生JavaScript的一个例子_第2张图片

第19717行的__webpack_require__(1), 其中__webpack_require__对应了jsx里的require,1代表react module,即加载的第一个module:

React jsx转换成原生JavaScript的一个例子_第3张图片

module 160:加载161,162:

React jsx转换成原生JavaScript的一个例子_第4张图片

161代表EventEmitter,

React jsx转换成原生JavaScript的一个例子_第5张图片

162代表object.assign实现:

React jsx转换成原生JavaScript的一个例子_第6张图片

对应原生JavaScript代码里声明的require(‘events’)和require(‘object-assign’):

React jsx转换成原生JavaScript的一个例子_第7张图片

要获取更多Jerry的原创文章,请关注公众号"汪子熙":

你可能感兴趣的:(JavaScript)