摘要： Babel是一个JavaScript编译器，不仅能将当前运行环境不支持的JavaScript语法（例如ES6、ES7等）编译成向下兼容的可用语法（例如ES3或ES5），这其中会涉及新语法的转换和缺失特性的修补；还支持语法扩展，从而能随时随地的使用JSX、TypeScript等语法。目前最新版本是7. 阅读全文

摘要： npm（Node Package Manager）是Node.js的包管理工具，相当于一个在线仓库。它提供了一个公共的平台，将分散在世界各地的包集中起来，能轻松的安装、分享和管理相关的包，不用再为搜索包而烦恼，并且npm能自动处理包的依赖项。它由三部分组成： （1）网站：可用来浏览、搜索包的信息。 阅读全文

摘要： 在网络工程中，路由能保证信息从源地址传输到正确地目的地址，避免在互联网中迷失方向。而前端应用中的路由，其功能与之类似，也是保证信息的准确性，只不过来源变成URL，目的地变成HTML页面。 在传统的前端应用中，每个HTML页面都会对应一条URL地址，当访问某个页面时，会先请求服务器，然后服务器根据发送 阅读全文

摘要： Redux的中间件（Middleware）遵循了即插即用的设计思想，出现在Action到达Reducer之前（如图10所示）的位置。中间件是一个固定模式的独立函数，当把多个中间件像管道那样串联在一起时，前一个中间件不但能将其输出传给下一个中间件作为输入，还能中断整条管道。在引入中间件后，既能扩展Re 阅读全文

摘要： Redux是一个可预测的状态容器，不但融合了函数式编程思想，还严格遵循了单向数据流的理念。Redux继承了Flux的架构思想，并在此基础上进行了精简、优化和扩展，力求用最少的API完成最主要的功能，它的核心代码短小而精悍，压缩后只有几KB。Redux约定了一系列的规范，并且标准化了状态（即数据）的更 阅读全文

摘要： 高阶组件（High Order Component，简称HOC）不是一个真的组件，而是一个没有副作用的纯函数，以组件作为参数，返回一个功能增强的新组件，在很多第三方库（例如Redux、Relay等）中都有高阶组件的身影。由于遵循了装饰者模式的设计思想，因此不会入侵传递进来的原组件，而是对其进行抽象、 阅读全文

摘要： 根据组件之间的嵌套关系（即层级关系）可分为4种通信方式：父子、兄弟、跨级和无级。 一、父子通信 在React中，数据是自顶向下单向流动的，而父组件通过props向子组件传递需要的信息是组件之间最常见的通信方式，如下代码所示，父组件Parent向子组件Child传递了一个name属性，其值为一段字符串 阅读全文

摘要： 由于React推崇组件模式，因此会要求HTML、CSS和JavaScript混合在一起，虽然这与过去的关注点分离正好相反，但是更有利于组件之间的隔离。React已将HTML用JSX封装，而对CSS只进行了较弱的封装，仅仅给出了基本的样式设置。不过，好在第三方库提供了CSS in JS的解决方案，让开 阅读全文

摘要： 表单元素是一类拥有内部状态的元素，这些状态由其自身维护，通过这类元素可让用户与Web应用进行交互。HTML中的表单元素（例如<input>、<select>和<radio>等）在React中都有相应的组件实现，不仅如此，React还将它们分成两种：受控组件和非受控组件。 一、受控组件 受控组件（Co 阅读全文

摘要： React在原生事件的基础上，重新设计了一套跨浏览器的合成事件（SyntheticEvent），在事件传播、注册方式、事件对象等多个方面都做了特别的处理。 一、注册事件 合成事件采用声明式的注册方式，类似于设置HTML属性，但有两点不同： （1）事件要采用小驼峰的命名法，而不是全部小写，例如oncl 阅读全文