React学习笔记(一）

知识点及简介

知识点

知识点

简介

• React JS :使用React的语法来编写一些网页的交互效果
• React Native:使用React的语法来编写原生APP
• React VR
• React.js -version 16.3.2版本 React Fiber
• React.js相比Vue.js灵活性更大，对于处理非常复杂业务时，技术方案选择性会更多；Vue.js则提供了更丰富的API，实现功能更简单，但由于API多，因此灵活性就有一定限制

开发环境搭建

脚手架工具

• GRUNT ; GULP ; WEBPACK
• React官方提供的脚手架工具 Create-react-app

• NPM是node.js的包管理工具

工程目录文件

• package.json文件是node的包文件
• 在React中，js文件可以引入包括css文件在内的任何文件

总结

声明式开发

可以与其他框架并存

组件化

React---单向数据流

• 说明：父组件可以向子组件传递值，但子组件只能使用这个值，绝对不能直接改变这个值
• 应用场景：例如父组件中包含多个子组件，每个子组件都会从父组件接收到同样的值，此时如果其中一个子组件改变了值，一旦页面出现了bug，那么对于开发人员来说就必须逐个去找引用了这个值的所有子组件是否有问题，这样的话会增加维护成本
• 解决方法：如果子组件必须要改变父组件的值，那么就让父组件向子组件传递一个方法，在子组件中去调用父组件传递过来的方法

React是视图层框架

• 在大型项目视图层级很多的情况下，组件的传值使用React就无法满足了，需要借助一些数据层的框架，来解决复杂传值问题

React是函数式编程

• 当项目较大时，可以将函数进行拆分，每个函数各司其职，便于维护
• 目前在前端中，有一个面向测试的开发流程，很多前端项目已经引入了自动化测试，函数式编程非常适合进行自动化测试

前置知识

• JS,CSS基础
• Sass,Compass
• 自动化工具 Yeoman，Grunt，Webpack
• CommonJS，NodeJS
• Git ,GitHub

关于JS的语法糖

• JSX
• CoffeeScript
• TypeScript