学习React前需要理解的名词
这是React启蒙系列的第二篇，本篇内容比较简单，用于阐述React初学者容易迷惑的一些名词。如果大家对本系列感兴趣，欢迎在GitBook上订阅。
在正式开始讲解React的机制之前，先之后学习React过程中会遇到的一些名词做一些讲解，是非常有必要的，这样能让后续学习少些迷惑。（原文中这些名词以字母表顺序组织，所以存在前面的名词解释涉及到后面的名词时，可能需要您跳转着阅读。不过这样来回的阅读，虽然麻烦，但是能让记忆更加深刻，所以译文仍以字母顺序表示。）
Babel
Babel是一个转换JavaScript ES*（JS2015，2016，2017）语句为ES5语句的工具。使用Babel，可以放心的在React中使用JavaScript可能还未被浏览器完全兼容的语法了。在React中，Babel也会转换JSX为ES5语句。
Babel CLI
Babel命令行工具，安装后可以通过命令行转换代码了。
Component Configuration Options
传递给React.createClass()的参数，是一个数组，里面包含一系列函数，使用此函数后会得到一个React Component的实例。
Component Life Circle Methods(组件生命周期函数)
组件中的一组事件，从语义上也可以看出其会在组件存在的不同阶段被执行。
(i.e., componentWillUnmount, componentDidUpdate, componentWillUpdate,shouldComponentUpdate, componentWillReceiveProps, componentDidMount,componentWillMount).
Document Object Model（DOM）文档对象模型
文档对象模型 (DOM) 是 HTML 和 XML 文档的编程接口。它给文档（结构树）提供了一个结构化的表述并且定义了一种方式—程序可以对结构树进行访问，以改变文档的结构，样式和内容。 DOM 提供了一种表述形式— 将文档作为一个结构化的节点组以及包含属性和方法的对象。从本质上说，它将 web 页面和脚本或编程语言连接起来了。MDN
ES
ES5
ECMAScript 标准的第5版，ECMA5.1在2011年6月推出。
ES6/ES 2015
ECMAScript 标准的第6版，于ECMA5.1在2015年6月推出。
ES7/ES 2016
将会在2016年推出的JavaScript语义的新版本
ES*
这个名词用于代表，现在以及将来的JavaScript标准，当你看到这个词的时候，你可能发现ES5，ES6甚至ES7的语法在混合使用。
JSX
JSX是一种可选的类XML的JavaScript的语法拓展，它用于在JavaScript文件中定义类Html树形结构。JSX必须被装换为JavaScript语句才能被浏览器识别渲染，Babel是React推荐的转换工具。
Node.js
Node.js是一个开源，跨平台的JavaScript运行环境（想想Java）,这个运行环境依托于Google V8 JS引擎解释JavaScript语句
npm
node.js社区提供的JavaScript包管理器
React Attributes/Props
props可以用两种理解，一是可以被当做构建React节点的参数，二是可以被理解为HTML标签的属性。具体如下
-
当
props与一个已知HTML属性相同时，当他被加入最终DOM中的HTML元素时，它就是该元素的属性； -
当被传入
React.createElement()中当做参数时，也可以是React node实例里的各种值。 -
一些特殊的用法，比如说
key、ref、dangerouslySetInnerHtml
React Component(React 组件)
一般组件
当调用React.createClass()(ES6中为React.Component)时，一个React组件会被创建。这个方法以一个对象作为参数（对象中包含多个函数），用于创建具体的React组件，最常见的函数是render(),这个方法用于返回React nodes。一个React组件中可包含多个React节点或React组件。
** React Stateless Function Component（无状态函数组件）**
如果一个组件里只需要props而不需要state,那么这个组件可以由纯函数方式创建，而不需要构建一个React组件的实例。
var MyComponent = function(props){
return <div>Hello {props.name}</div>;
};
ReactDOM.render(<MyComponent name="doug" />, app);
React nodes
React nodes
用于表现Virtual DOM的类HTML元素节点，React中最基础的对象类型，可由React.createElement('div')创建,用以代表DOM节点和子DOM节点，它具有轻量的，无状态，不可变的特点。
React Node Factories
是一个构建特点类型的React nodes的方法（<div>、<li>等等）
React Text节点
Virtual DOM中的文本节点可以由React.createElement('div',null,'a text node')创建。
React
React是一个开源的JavaScript框架，用它可以构建清晰，高效，具有弹性的用户界面。
Virtual DOM
由React节点和组件构建的JavaScript树形结构，用于高效的重构HTML中的真实DOM。
Webpack
是一个组件管理和打包的工具，它可以很好的处理组件之间的依赖关系，并且可以产生静态的文件来代表这些组件。
网友评论