react-入门基础、细说三大前段框架历史

前端三大框架 

1. angular分为：angular 1.X（angularJS）和Angular2.x，两者的区别类似 Java 和 JavaScript 或者说是雷锋与雷峰塔的区别，angular 1.X 属于MVC框架，但是几乎绝迹，很少使用。Angular2.x 属于MVVM框架。于2012-03-28发布第一版
2. Vue.js是一套构建用户界面的渐进式框架。Vue 从根本上采用最小成本、渐进增量的设计。Vue 的核心库只专注于视图层。他是中国大神尤雨溪将angular和react结合取其中的优点创作，所以vue的市场几乎都在中国，也遍布中国。最早版本：0.0.0，于2013-12-07发布第一版
3. React 是一个用于构建用户界面的 JAVASCRIPT 库。React主要用于构建UI，很多人认为 React 是 MVC 中的 V（视图），重视图层。React 起源于 Facebook 的内部项目，并于 2013 年 5 月开源。React 拥有较高的性能，代码逻辑非常简单。于2011-10-26发布第一版

react基础详解

  一、同vue一样都是用来操作虚拟DOM，其性能高，可以解决一些终端问题（PC端，移动端）

  二、入门建议使用直接引入react.js

1. 下载react.js，（react.js 自己什么也做不了 必须借助插件,例如后边俩）react-dom.js,browser.js。
2. 创建html文件夹，将上述js按顺序引入
3. 接着就可以写一个最简单的例子

    ReactDOM.render(
       <h1>Hello, world!</h1>,
       document.getElementById('root')
    );  //需要创建一个id名为root的容器

   三、React 使用 JSX 来替代常规的 JavaScript。JSX 是一个很像 XML 的 JavaScript 语法扩展，JSX可用可不用，他的优点：

1. JSX 执行更快，因为它在编译为 JavaScript 代码后进行了优化。
2. 它是类型安全的，在编译过程中就能发现错误。
3. 使用 JSX 编写模板更加简单快速。

   let a = '<div>aaa</div>'//js中一段代码需要引号括起来
   
   let b = (<div style={{width:'100px'}}>
               <div>Hello</div>
               <span>React</span>
           </div>)//JSX中不需要引号直接编写就好，但是给标签加style需要将样式用双花括号括起来。
   ReactDOM.render(
       <div>
           <h1>{b}</h1>
           <input type="text" defaultValue="123"/>
           <input type="checkbox" defaultChecked/>
       </div>,//末位的逗号必须有，如果要将b引入到标签中需要花括号括起来，单标签必须在后边加反斜杠
       document.getElementById('app')
   )
   
   

                                  欲知后事如何，请听下回分解。