redux源码解析(深度解析redux+异步demo)
redux源码解析
1、首先让我们看看都有哪些内容
2、让我们看看redux的流程图
Store:一个库,保存数据的地方,整个项目只有一个
创建store
Redux提供 creatStore 函数来生成 Store
// 引入redux
import { createStore } from 'redux'; //创建Store 需要传递一个函数fn 这里的fn是之后会提及的reducers
const store = createStore(fn);
State:状态,某时刻的数据即是Store的状态
获取状态的方法是store.getState()
Action:行为,它有一个不可或缺的type属性
action还可以携带其他内容
我们可以使用action来改变State的值,
从而将我们需要的数据通过Action“运输”到 Store;
dispatch:发送action
dispatch(action)接受一个action对象为参数,并将它发送出去,
Store接受Action,接受之后需要返回一个新的State(状态)
Reducer:处理器
dispatch(action)接受一个action对象为参数,并将它发送出去,
Store接受Action,接受之后需要返回一个新的State(状态)
而创建这个新的状态的过程就是reducer
3、从isPlainObject.js开始
/**
* @param {any} obj The object to inspect.
* @returns {boolean} True if the argument appears to be a plain object.
*/
export default function isPlainObject(obj) {
if (typeof obj !== 'object' || obj === null) return false let proto = obj
while (Object.getPrototypeOf(proto) !== null) {
proto = Object.getPrototypeOf(proto)
} return Object.getPrototypeOf(obj) === proto
}
· 这个函数的核心思想在于什么呢?
在于判断一个值是否为一个普通的对象
此处的普通对象指的是直接通过字面量(let obj={})或者new Object()创建出来的对象
· 那么他是怎么做判断的呢?
if (typeof obj !== 'object' || obj === null) return false
这行代码排除掉肯定不是对象的值
注意:typeof null 的返回值为 "object". 所以只使用 typeof obj !== 'object' 不能将 null 值排除掉.
因此应使用 typeof obj !== 'object' || obj === null 进行判断.
再往下就是通过原型链判断了.
通过 while 不断地判断 Object.getPrototypeOf(proto) !== null 并执行,
最终 proto 会指向 Object.prototype. 这时再判断 Object.getPrototypeOf(obj) === proto,
如果为 true 的话就代表 obj 是通过字面量或调用 new Object() 所创建的对象了.
Object.getPrototypeOf()
方法用于获取一个对象的原型属性指向的是哪个对象.
举个redux源码解析(深度解析redux+异步demo)的更多相关文章
- 深入源码,深度解析Java 线程池的实现原理
java 系统的运行归根到底是程序的运行,程序的运行归根到底是代码的执行,代码的执行归根到底是虚拟机的执行,虚拟机的执行其实就是操作系统的线程在执行,并且会占用一定的系统资源,如CPU.内存.磁盘.网 ...
- Redux源码分析之bindActionCreators
Redux源码分析之基本概念 Redux源码分析之createStore Redux源码分析之bindActionCreators Redux源码分析之combineReducers Redux源码分 ...
- Redux源码分析之combineReducers
Redux源码分析之基本概念 Redux源码分析之createStore Redux源码分析之bindActionCreators Redux源码分析之combineReducers Redux源码分 ...
- 手把手教你撸一套Redux(Redux源码解读)
Redux 版本:3.7.2 Redux 是 JavaScript 状态容器,提供可预测化的状态管理. 说白了Redux就是一个数据存储工具,所以数据基础模型有get方法,set方法以及数据改变后通知 ...
- Redux源码分析之applyMiddleware
Redux源码分析之基本概念 Redux源码分析之createStore Redux源码分析之bindActionCreators Redux源码分析之combineReducers Redux源码分 ...
- Redux源码分析之createStore
接着前面的,我们继续,打开createStore.js, 直接看最后, createStore返回的就是一个带着5个方法的对象. return { dispatch, subscribe, getSt ...
- Redux源码分析之基本概念
Redux源码分析之基本概念 Redux源码分析之createStore Redux源码分析之bindActionCreators Redux源码分析之combineReducers Redux源码分 ...
- Redux源码分析之compose
Redux源码分析之基本概念 Redux源码分析之createStore Redux源码分析之bindActionCreators Redux源码分析之combineReducers Redux源码分 ...
- Flink 源码解析 —— 深度解析 Flink 是如何管理好内存的?
前言 如今,许多用于分析大型数据集的开源系统都是用 Java 或者是基于 JVM 的编程语言实现的.最着名的例子是 Apache Hadoop,还有较新的框架,如 Apache Spark.Apach ...
随机推荐
- NativeWindow_01_CreateWindow(Ex)_VC6
1. #include <windows.h> LRESULT CALLBACK ProcWindow(HWND hwnd, UINT uMsg, WPARAM wParam, LPARA ...
- flutter安装与配置 v1.2.1版本
1---- 上面是下载地址https://flutter.dev/docs/development/tools/sdk/archive#windows 2---- 下载后,解压安装到C盘 3--- 测 ...
- vue中兄弟组件间通讯
vue2.0中兄弟组件间的通讯是通过eventBus(事件发布订阅)实现的. eventBus.js import Vue from 'vue' const eventBus = new Vue() ...
- POI 导入导出时异常[java.io.IOException: Broken pipe]
使用用POI导出文件时抛出异常java.io.IOException: Broken pipe ERROR: 'java.io.IOException: Broken pipe' org.apache ...
- 全排列问题Ⅰ(Java实现)
给定一个没有重复数字的序列,返回其所有可能的全排列. 示例: 输入: [1,2,3] 输出: [ [1,2,3], [1,3,2], [2,1,3], [2,3,1], [3,1,2], [3,2,1 ...
- Codeforces 1053 C - Putting Boxes Together
C - Putting Boxes Together 思路: 求带权中位数 用树状数组维护修改 代码: #pragma GCC optimize(2) #pragma GCC optimize(3) ...
- (转)c#反射
1. 什么是反射2. 命名空间与装配件的关系3. 运行期得到类型信息有什么用4. 如何使用反射获取类型5. 如何根据类型来动态创建对象6. 如何获取方法以及动态调用方法7. 动态创建委托 1.什么是反 ...
- windows10 64bit 下的tensorflow 安装及demo
目前流行的深度学习库有Caffe,Keras,Theano,本文采用谷歌开源的曾用来制作AlphaGo的深度学习系统Tensorflow. 1:安装Tensorflow 最早TensorFlow只支持 ...
- HTML第十四章总结 HTML forms
第十四章主要讲了 html forms,通过 forms,我们可以得到 customers' feedback,使得网页能够 interactive,本章的内容分为三个部分: forms 的 elem ...
- InitializingBean和DisposableBean
InitializingBean 记住一点:InitializingBean接口为bean提供了初始化方法的方式,它只包括afterPropertiesSet方法,凡是继承该接口的子类,在初始化bea ...