ES6
默认jsavscript 定义的var 变量是全局变量
let ：块级作用于 定义的变量只在改作用域中有效
const：定义常量 ；一点定义不可改变，引用的变量可以改变引用变量属性的值。
常用的箭头函数： (a,b) => { return a+b; } 格式：（参数1，参数2 ...) => { 函数逻辑体 }
...args 表示一个数组，常用于传入数组参数
★ 字符串拼接 使用``包含所有字符串，变量使用${ var } 获取 例如 let name = 'zhangsan'; console.log(`my name is ${name}`);
export 导出，将函数公开到模块，其他人可以引用
import 导入，将别人写的模块加载到并引用
Babel
安装 npm install babel-cli -g
配置 .babelrc 文件，
预设prest[主要是将ES6转变为ES5] npm install --save-dev babel-preasct-es2015
插件pluagle[主要是]
前端组件化
webpack：单入口组件
原理：定义一个index.js作为入口，然后其他引用都在这个里面定义引用，对与html只需要引入这一个文件。
安装：npm install lodash
npm查看全局安装位置命令：npm prefix -g
配置文件：package.json
–save 保存安装到生产环境
–dev 保存插件安装到开发环境中
一般安装使用 npm install react –save-dev
通过package.json 配置反反向安装所有应用使用的命令 ： npm install 带cmd 目录要有package.json文件
Gulpss 任务流工具
安装：npm install -g gulp-cli
配置文件：gulpfile.js
webpack模块打包工具
代码拆分：通常我们将所有js文件打包成一个index.js 。这个功能就是 将项目中js 根据不同功能打包成几个js文件，用到时在加载。减轻初始页面加载文件大小过大
静态分析：支持正则表达式 和 简单的变量
模块热替换： webpack –dev-server –hot
配置文件：entry、output、module
entry：定义项目入口文件
output： path、filename、publicpath
path：输出的目录位置
filename：输出文件名称
publicpath：公共路径，指的是 输出路径对应的外部路径。 例如http://www/lushunde.com/index.html 对应外部路径是http://lushunde.com/
module：loaders、plugin
loaders ：定义转换方式
pulgin：html-webpack-paugin 生成一个几乎为空的html页面为文件
实时构建： watch 监视代码改动则更新页面功能。
react介绍
1.组件：一切基于组件。定义组件，想引用 普通html标签一样引用。
2.jsx：一种支持html与js混写的
3.virtual DOM：使用javasctipt创建类似于Dom树一样的对象，然后通过diff算法算出变更的节点，通过patch方法仅更新改变的真实DOM。
性能：通过javacript对象的diff算法换取频繁操作真实DOM的巨大开销。
JSX：语法
1.html标签第一个字母小写
2.定义的组件 第一个字母大写
3.javascript 中保留或者关键字 替换写法：例如 class =》className
4.省略属性值时，默认为true 。例如 有属性display ，默认为true
5.注释 使用｛/* 注释的内容 */｝
6.属性扩散 使用｛...props｝
7.编译
生命周期
初始化：
1.getDefultProps 初始化调用一次，设置this.props属性 基本不用管理
2.getInitialState 初始化调用一次，设置this.state属性 在ES6中已经被constructor 替代，直接在constructor 中设置初始state属性值
3.componentWillMount 初始化在render之前执行一次 此时没有dom节点，只能设置一些渲染数据处理
4.render （必须方法）初始化执行，不应该有修改state或者交互方法，渲染数据，返回reactElement
5.componentDidMount 初始化render在之后执行一次 此时可以获取dom节点，长用于获取dom节点或者ajax等操作
组件props更新
1.conponentWillReceiveProps（object nextprops） 接受新的props，长与this.props 比较，然后设置this.state 来跟新render
2.shountComentUpdate 返回true ，执行之后的操作；返回false，中断操作。默认返回true
3.compomentWillUpload 在render之前执行
4.render
5.componentDidUpdate 在render之后执行
组件卸载
componentWillUnmount 卸载组件之前调用
无状态函数组件
没有内部的state，不需要生命周期。只是渲染props的数据
state设计原则
1.尽量使用轻量级的json格式定义
2.能在render中计算出来的值就不要定义在state中
DOM操作
1.在需要获取dom的节点元素上使用 ref 标记 例如 ref='age'
2.在方法上使用 this.refs.age 获取指定的dom节点
Viryrul Dom
实质：使用javascript.createElement 创建出一个类似于 dom树的 对象
使用ReactDom的render方法将 虚拟dom 插入到真实的dom中去
整体流程：
1.构建Virtual Dom树结构
2.将Virtual Dom插入到真实的
3.变化后生成新的Virtual Dom树
4.通过diff算法算出来两棵树的不同
5.更新变更的dom节点
