Meowmow的博客

props（父子组件）: (1) children props (2) render props消息订阅发布（兄弟组件、跨级组件）: pubs-sub集中式管理（兄弟组件、跨级组件）： reduxconText（跨级组件）：生产者-消费者模式。

action一般为一个对象，action也可以为一个函数，当它为对象时，是同步的，当它是函数时，是异步的。引入中间件，当返回的action是一个函数包含异步任务时，由中间件处理异步部分，将异步任务完成后生成的对象类型的action传递给store，再去真正操作数据，解决报错。以上就是完整的redux，有action，store，reducer，组件和constant五个文件内容，其中组件、store、reducer是必须的。根据模型图，容器组件要向外连接redux，向内连接UI组件。

Router包含BrowserRouter和HashRouter，BrowserRouter适用于请求服务器的情况，路径中没有#，HashRouter适用于不请求服务器的情况，路径中带有#。导航区写路由组件链接，展示区注册路由。路由跳转有replace和push两种方式，默认是push，push方式可以返回，在浏览器路径可以看到，replace是替换之前的路径，不可返回前面的路径。这样当3000端口发送请求时，先查看当前端口是否有请求资源，若有，直接返回数据，若没有，会向5000端口请求资源，然后返回。

脚手架用来帮助快速创建基于xxx库的模板项目，包含了所有需要的配置，下载好了所有相关依赖，可以直接运行一个简单的效果。使用脚手架的项目特点有：模块化、组件化、工程化。react脚手架：create-react-app项目的整体技术架构为react+webpack+es6+eslint。

一、初始化阶段：由ReactDOM.render()触发，初次渲染3.render()4.componentDidMount() ===>常用，一般做初始化，比如开定时器、发送网络请求、订阅消息二、更新阶段：由组件内部this.setState()或父组件render触发3.render() ===> 必须用三、卸载组件：由ReactDOM.unmountComponentAtNode()触发。

-- ....省略引入react有关js文件，示范虚拟DOM渲染过程-->// 虚拟DOM// 将虚拟DOM渲染到页面</script>

只有当前API执行完成后，才能继续执行下一个API异步API当前API的执行不会阻塞后续代码的执行区别同步API可以从返回值拿到API执行的结果，异步API不可以。同步异步同步API从上到下依次执行，前面代码会阻塞后面代码执行，异步API不会等待API执行完再执行后面的代码。同步回调函数定义的函数作为参数传递给另一个函数调用。Node.js的异步API异步API后面的代码依赖异步API的结果异步API后面的代码依赖异步API的执行结果，实际上执行的时候异步API还没有返回结

Express是基于Node.js平台的快速开发极简的web开发框架。作用类似node内置模块http。本质是npm上的第三方包，基于内置模块http封装出来的，提供快速创建web服务器的方法。使用Express可以方便快速创建web网站服务器或API接口的服务器。在项目目录下运行以下命令创建基本的web服务器监听GET请求监听POST请求响应内容到客户端获取URL携带的查询参数获取URL中的动态参数托管静态资源存放静态文件的目录名不会出现在url中挂载路径前缀

自顶向下把系统划分为若干个模块的过程叫模块化。对系统来说，模块是可以组合、分解、和更换的单元。提高了代码的复用性，代码的可维护性，可以实现按需加载。按模块的来源分为三类：1、内置模块：fs,path,http2、自定义模块：用户创建的js文件3、第三方模块：第三方开发，使用需要下载使用require加载模块，加载模块时会执行模块中的代码模块作用域只能在当前模块访问，这种限制叫做作用域。防止了全局变量污染的问题。向外共享模块作用域成员module对象每个.js自定义模块中都有一个modul

Node.js是基于Chrome V8引擎的JavaScript运行环境，无法调用DOM和BOM等浏览器内置API。使用Node.js可以：基于Express框架快速搭建web应用基于Electron框架构建跨平台的桌面应用基于restify框架构建API接口项目操作数据库，创建实用的命令行工具打开终端，输入命令快捷键：↑：上一次执行的命令tab：快速补全路径esc：快速清空已经输入的命令cls：清空终端操作文件的模块使用fs模块需要先导入模块初试读取文件判断文件是否读取成功 ，根

XMLHttpRequest简称xhr，是浏览器提供的JavaScript对象，可以通过它可以请求服务器上的数据资源。Jquery里的Ajax函数就是通过xhr封装出来的。URL末尾加上的用于向服务器发送信息的字符串。格式：英文的？放在URL末尾，再加上 参数=值，多个参数用&连接。URL编码和解码URL编码的原则：使用安全的字符去表示不安全的字符，用英文字符表示非英文字符。使用xhr发起get请求1、创建xhr对象2、调用xhr.open()3、调用xhr.send()4、监听xhr.

表单在网页中主要负责数据采集功能，通过< form >标签的提交操作把采集到的信息提交到服务器处理。表单的三个基本组成部分：1、表单标签。2、表单域：包含了文本框，密码框，隐藏域，多行文本框，复选框，单选框，下拉选择框和文件上传框等。3、表单按钮。用来规定当提交表单时，向何处发表表单数据。action的值为后端提供的一个URL地址，这个URL地址专门负责接受表单提交过来的数据。当form表单在未指定action属性值的情况下，action属性默认值为当前页面的URL地址。提交表单后，页面会立即

上网的本质目的：通过互联网的形式获取和消费资源。服务器：负责存放和对外提供资源的电脑。客户端：负责获取和消费资源的电脑。文本、图片、视频、音频、数据…数据是网页的灵魂。URL：UniformResourceLocator，统一资源定位符，用于标识互联网上每个资源的唯一存放位置。例：htpp://www.baidu.comhttp://www.taobao.com1、客户端和服务器之间的通信协议；2、存有资源的服务器名称；3、资源在服务器具体存放位置；通信协议+域名+端口号+路径+询问项+锚

ES的全称：ECMAScript，由ECMA国际标准化组织制定的一项脚本语言的标准化规范。ES6泛指ES2015及以后的版本ES6新增的关键字，用于声明变量的关键字。let声明的变量只在所处的块级有效。let可以防止循环变量变成全局变量。let不存在变量提升。let声明的变量具有暂时性死区特性经典面试题var声明i是全局变量，循环过后就变成了10，函数执行时输出的是全局变量的值let每次循环都会生成一个块级作用域，每个块级作用域的变量都是不同的。const声明变量，声明时必须赋值，常值就

用于匹配字符串中字符组合的模式，JavaScript中正则表达式也是对象。正则表达式通常用来检索、替换文本，比如验证表单、搜索。利用RegExp对象的构造函数创建字面量创建test方法用来检测字符串是否符合正则表达式特殊字符比如^, $, + …^ 表示以谁开始$ 表示以谁结束字符类[ ][ ] 里的^表示取反范围 -字符组合量词符设置某个模式出现的次数预定义类预定类说明\d0-9的任一字符相当于[0-9]\D0-9以外的字符，相

1、函数声明：function关键字；2、函数表达式（匿名函数）；3、new Function()；所有函数都是Function的实例，函数也属于对象，所以函数也有原型对象，实例化函数对象也有对象原型。1、普通函数2、对象的方法3、构造函数4、绑定事件函数5、定时器函数6、立即执行函数apply()应用：apply的参数必须是数组（伪数组），可以用来求一组数的最大值，比如Math.max（数1，数2，数3…）bind()严格模式IE10以上支持，可以应用到在整个脚本或者个

以对象功能划分问题。特性：封装性、继承性、多态性。易维护、易复用、易扩展，性能比面向过程低。思维特点：1、抽取对象共用的属性和行为组织成一个类2、对类进行实例化、获取类的对象class关键字声明一个类。类名首字母大写。创建实例构造函数constructorconstructor()方法是类的构造函数，用于传递参数、返回实例化对象，通过new命令生成对象实例时自动调用该方法，如果没有显示定义，类内部会自动创建一个constructor()。类里的所有函数不需要写function，多个函数之

触屏事件对象toucheventtouchstart, touchmove, touchend都有自己的触屏事件对象touchstart, touchmove, touchend都可以拖动元素。拖动元素需要获取手指的坐标值，使用tartgetTouches[0]里的pageX和pageY.。手指移动的距离：手指滑动中的位置减去手指刚开始触摸的位置。拖动元素监听事件步骤：1、touchstart: 获取手指初始坐标，获取盒子原来的位置2、touchmove: 计算手指的滑动距离，并且移动盒子3、

案例：获取鼠标在盒子内的坐标元素可视区client系列属性作用element.clientTop元素上边框的大小element.clientLeft元素左边框的大小element.clientWidth返回元素包括内边距、内容宽度，返回值不带单位element.clientHeight返回元素包括内边距、内容高度，返回值不带单位立即执行函数不需要调用，立马执行的函数,独立创建了一个作用域，里面所有的变量都是局部变量，不会有命名冲突的问题。元素滚动

目录BOM概述DOM和BOM的对比window对象的常见事件定时器JS执行机制location对象navigator对象history对象BOM概述BOM：浏览器对象模型，提供了独立于内容与窗口进行交互的对象，核心对象是window由一系列相关对象构成，每个对象都有很多属性和方法DOM和BOM的对比DOMBOM文档对象模型浏览器对象模型把文档当对象把浏览器当对象顶级对象document顶级对象window主要操作页面主要是浏览器窗口交互的对象W3