没有用到React为什么还要import引入React

前言：

提起React，总是免不了和Vue做一番对比

Vue的API设计非常简洁，但是其实现方式却让人感觉是“魔法”，开发者虽然能马上上手，但其原理却很难说清楚。

相比之下React的设计哲学非常简单，虽然有很多需要自己处理的细节问题，但它没有引入任何新的概念，相对更加的干净和简单。

关于JSX：

在理解JSX之前，我们先抛出一个面试官经常问到的问题，就是
为什么在JS文件里我们没有用到React，而在文件顶部需要import引入React呢？
想必有很多人都是写过这句代码，但不清楚有什么作用

在开始之前，我们有必要搞清楚一些概念。

我们来看一下这样一段代码：

const title = <h1 className="title">Hello, world!</h1>;

这段代码并不是合法的js代码，它是一种被称为jsx的语法扩展，通过它我们就可以很方便的在js代码中书写html片段。

本质上，jsx是语法糖，上面这段代码会被babel转换成如下代码：

const title = React.createElement(
    'h1',
    { className: 'title' },
    'Hello, world!'
);

看到上面的代码相比大家都知道答案了

本质上来说JSX是React.createElement(component, props, ...children)方法的语法糖。
所以我们如果使用了JSX，我们其实就是在使用React，所以我们就需要引入React