当前位置:网站首页>NgRx Store createSelector 的单步调试和源代码分析
NgRx Store createSelector 的单步调试和源代码分析
2022-08-01 21:54:00 【华为云】
源代码:
import { Component } from '@angular/core';import { createSelector } from '@ngrx/store'; export interface State { counter1: number; counter2: number;} export const selectCounter1 = (state: State) => state.counter1;export const selectCounter2 = (state: State) => state.counter2;export const selectTotal = createSelector( selectCounter1, selectCounter2, (counter1, counter2) => counter1 + counter2); // selectTotal has a memoized value of null, because it has not yet been invoked.
createSelector 内部:
function createSelector(...input) { return createSelectorFactory(defaultMemoize)(...input);}
defaultMemoize 返回一个对象,每个字段指向一个函数:
输入参数我传入了三个纯函数,即没有 side effect,可以重复执行的函数。这三个纯函数被维护到了一个数组内:
进入到 createSelectorFactory 返回的函数体内部:
从源代码可以看出,createSelector接收的可变数目的参数,最后一个被当成 projector 看待,其余均视作 selector.
分下列几种情况讨论:
(1) 第一次执行,lastArguments undefined, 进入该 IF 分支,执行 projection,将结果保存,并返回。
(2) 如果是重复执行,且输入参数没有变化,则直接返回上一次执行的结果
(3) 执行到这里,说明是重复执行,且参数发生了变化,则重新执行 projection
(4) 如果再次执行和前次执行的结果相同,返回前次结果
createSelector 最终返回的,是带有记忆功能的 selector:
以后如若要调试,记住代码的大概位置在 970,搜索关键字 memoized.
边栏推荐
猜你喜欢
随机推荐
ModuleNotFoundError: No module named ‘yaml‘
familiar friend
Spark cluster construction
Scala练习题+答案
一种灵活的智能合约协作方式
线上故障排查方案
The thing about npm
ModuleNotFoundError: No module named 'yaml'
leetcode 204. Count Primes 计数质数 (Easy)
论文解读(GSAT)《Interpretable and Generalizable Graph Learning via Stochastic Attention Mechanism》
上传markdown文档到博客园
render-props and higher order components
Recycling rental system 100% open source without encryption Mall + recycling + rental
工程建筑行业数据中台指标分析
Based on php Xiangxi tourism website management system acquisition (php graduation design)
Raspberry Pi information display small screen, display time, IP address, CPU information, memory information (C language), four-wire i2c communication, 0.96-inch oled screen
Chapter 12, target recognition of digital image processing
10 Practical Uses of NFTs (NFT System Development)
Still struggling with reporting tool selection?To take a look at this
统计单词数