reselect提供的createSel【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】ector API具有记忆功能，但是它的著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。用法奇怪，让入门者比较难理解，我也废了不【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】少力才理解到这块。现在通过模拟脚本，来协原创内容，盗版必究。原创内容，盗版必究。助理解。先来看下我们怎么创建一个sele【版权所有，侵权必究】原创内容，盗版必究。ctor函数：

let selector = createSelector([fun1, fun2], fun3)

在使用selector的时候，把它当作一著作权归作者所有，禁止商业用途转载。【转载请注明来源】个函数，传入state和props作为参原创内容，盗版必究。转载请注明出处：www.tangshuang.net数。接下来我们通过selector的反推【原创内容，转载请注明出处】转载请注明出处：www.tangshuang.net来理解：

let someState = selector(state, props)
 <- 在mapStateToProps中这样用推导出 =>
let someState = (function(state, props) {
  let state1 = fun1(state, props)
  let state2 = fun2(state, props)
  return fun3(state1, state2)
})(state, props)

这样就可以非常容易的理解，createS未经授权，禁止复制转载。著作权归作者所有，禁止商业用途转载。elector传入的参数中的函数，各自在【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。什么时候执行，执行的结果拿来干什么。

createSelector的第一个参数【访问 www.tangshuang.net 获取更多精彩内容】转载请注明出处：www.tangshuang.net是个数组，数组的个数和第二个参数函数(f转载请注明出处：www.tangshuang.net原创内容，盗版必究。un3)的参数个数相同，这个怎么做到呢？著作权归作者所有，禁止商业用途转载。本文版权归作者所有，未经授权不得转载。其实很简单，用扩展运算符…或本文作者：唐霜，转载请注明出处。【关注微信公众号：wwwtangshuangnet】者用.apply都可以做到。

最后的问题是，如何做到记忆功能呢？未经授权，禁止复制转载。

reselect的记忆功能的规则是，fu【版权所有，侵权必究】未经授权，禁止复制转载。n3的实参如果不变，那么说明它的运算结果原创内容，盗版必究。本文作者：唐霜，转载请注明出处。也不变，可以直接返回缓存起来的结果。

所以，要使记忆功能生效，你必须保证fun【转载请注明来源】原创内容，盗版必究。3的实参不变，说白了，就是fun1, f【版权所有】唐霜 www.tangshuang.net【原创内容，转载请注明出处】un2的计算结果不变，因此fun1, f【访问 www.tangshuang.net 获取更多精彩内容】【作者：唐霜】un2必须是返回固定值的函数。这种函数比【未经授权禁止转载】【本文受版权保护】pure function还要硬性，即使【转载请注明来源】未经授权，禁止复制转载。参数不同，也要永远返回一个值。当然，我们本文版权归作者所有，未经授权不得转载。【未经授权禁止转载】是不可能做到这样的，如果fun1依赖的s转载请注明出处：www.tangshuang.net原创内容，盗版必究。tate发生来变化，那么它的结果自然就会【版权所有，侵权必究】【版权所有，侵权必究】变，这个时候，fun3就不再返回缓存，而【作者：唐霜】本文版权归作者所有，未经授权不得转载。是重新计算结果，同时缓存新的结果，下次就本文作者：唐霜，转载请注明出处。原创内容，盗版必究。可以用这个缓存了。这样，就做到selec本文作者：唐霜，转载请注明出处。本文作者：唐霜，转载请注明出处。tor的响应式。

最后的问题是，如果fun1, fun2的【本文首发于唐霜的博客】原创内容，盗版必究。结果会随着props的不同而返回不同的结【作者：唐霜】【未经授权禁止转载】果呢？这种情况普遍存在，一个react组【本文受版权保护】【作者：唐霜】件可能在一个页面里面被多次使用，每次使用著作权归作者所有，禁止商业用途转载。【本文首发于唐霜的博客】的时候props可能不同。这就会导致re本文版权归作者所有，未经授权不得转载。原创内容，盗版必究。select的记忆功能失效。

解决的办法还是要从记忆功能的原理中去寻找【原创内容，转载请注明出处】原创内容，盗版必究。。

每一个计算结果的缓存，与传入fun3的参转载请注明出处：www.tangshuang.net【关注微信公众号：wwwtangshuangnet】数是一一对应的，fun3可以说是一个pu本文版权归作者所有，未经授权不得转载。本文作者：唐霜，转载请注明出处。re function，参数相同的情况下【关注微信公众号：wwwtangshuangnet】【原创内容，转载请注明出处】，得到的结果永远相同。有两种解决的想法：

1. 为每一个组件设置单独的映射，这个可以通过【版权所有，侵权必究】【访问 www.tangshuang.net 获取更多精彩内容】react-redux的connect来【本文首发于唐霜的博客】本文作者：唐霜，转载请注明出处。实现，当mapStateToProps返【作者：唐霜】本文作者：唐霜，转载请注明出处。回的是一个函数时，那么这个函数的运算结果【本文首发于唐霜的博客】【转载请注明来源】仅对组件的当前实例生效，也就是说，在我们【关注微信公众号：wwwtangshuangnet】原创内容，盗版必究。写mapStateToProps函数时，原创内容，盗版必究。著作权归作者所有，禁止商业用途转载。不能直接返回映射关系，而是返回一个函数，本文版权归作者所有，未经授权不得转载。【版权所有】唐霜 www.tangshuang.net这个函数里面去做一些处理后再返回映射关系【版权所有】唐霜 www.tangshuang.net本文版权归作者所有，未经授权不得转载。。下面有例子。
【原创内容，转载请注明出处】【关注微信公众号：wwwtangshuangnet】【版权所有，侵权必究】本文版权归作者所有，未经授权不得转载。
2. 既然fun3的计算结果是根据参数来缓存的本文版权归作者所有，未经授权不得转载。【转载请注明来源】，那么我们可以尝试对参数做hash，固定【关注微信公众号：wwwtangshuangnet】【作者：唐霜】的参数对应固定的fun3函数体，不同的参【转载请注明来源】【转载请注明来源】数对应不同的fun3函数体，当在不同的参原创内容，盗版必究。【本文首发于唐霜的博客】数之间切换时，如果发现这个hash有存在著作权归作者所有，禁止商业用途转载。著作权归作者所有，禁止商业用途转载。的fun3函数体，那么就立即用它的缓存。【本文首发于唐霜的博客】【作者：唐霜】下面也有例子。
【转载请注明来源】原创内容，盗版必究。本文作者：唐霜，转载请注明出处。【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】

想法1的例子：未经授权，禁止复制转载。

const makeMapStateToProps = () => {
 const getSelector = makeSelector() // 下一段代码看makeSelector是怎么写的
 const mapStateToProps = (state, props) => {
  return {
   todos: getSelector(state, props)
  }
 }
 return mapStateToProps
}
export default connect(makeMapStateToProps)(MyComponent)

import { createSelector } from 'reselect'
function getSelector(state, props) {
  return state[props.id]
}

export function makeSelector() {
  return createSelector(
    [ getSelector ],
    (user) => {
      user.total_books = user.books.length
      return user
    },
  )
}

通过结合文章开头的推导代码，你会发现，每著作权归作者所有，禁止商业用途转载。原创内容，盗版必究。个组件的实例的props.id是一定的，【转载请注明来源】转载请注明出处：www.tangshuang.net因此对应的user也是一定的，那么每次都未经授权，禁止复制转载。【访问 www.tangshuang.net 获取更多精彩内容】可以使用缓存起来的user。当然，如果p原创内容，盗版必究。【本文首发于唐霜的博客】rops.id改变来，那么缓存就失效了。

想法2，对makeSelector做深度【版权所有】唐霜 www.tangshuang.net【转载请注明来源】改造：

let selectors = {}
function makeSelector(uid) {
  if (selectors[uid]) return selectors[uid]
  let selector = createSelector(...)
}
function deleteSelector(uid) {
  delete selectors[uid]
}

在connect的时候，直接在makeS【关注微信公众号：wwwtangshuangnet】本文作者：唐霜，转载请注明出处。elector的时候传入props.id【未经授权禁止转载】【关注微信公众号：wwwtangshuangnet】作为标记，mapStateToProps【未经授权禁止转载】【访问 www.tangshuang.net 获取更多精彩内容】不再返回函数作为结果。当不再对uid对应【本文首发于唐霜的博客】著作权归作者所有，禁止商业用途转载。的用户进行操作之后，要即时删除这个sel本文版权归作者所有，未经授权不得转载。【关注微信公众号：wwwtangshuangnet】ector。