为什么React中lodash的isEqual对比含Redux函数的props时返回true？

你之前的认知适用于父组件每次渲染生成新的内联函数作为props传递的场景，当前场景下对比返回true是符合预期的，核心原因有两个： #

1. lodash _.isEqual 的函数比较规则 #

_.isEqual对函数类型的属性执行的是引用相等比较，并非只要属性类型是函数就必然返回不等，只要两个函数指向同一个内存地址，就会被判定为相等。

2. Redux注入的方法引用本身是稳定的 #

你props中的dispatch和saveHeaderSettings都来自Redux的mapDispatchToProps，这类Redux注入的方法默认引用是稳定不变的：

• dispatch是Redux store实例上的原生方法，整个应用生命周期内引用不会发生变化
• 如果你使用的是对象形式的mapDispatchToProps（直接导出包含action creator的对象），Redux内部会自动绑定dispatch并缓存生成的方法，整个组件生命周期内方法引用都不会更新
• 就算你使用的是函数形式的mapDispatchToProps，只要你没有在函数内部每次返回新的匿名函数，Redux也会默认缓存生成的props，避免不必要的引用变化
  剩下的其他props都是基本类型，或者嵌套对象内的属性都是基本类型，只要值没有发生变更，_.isEqual遍历所有属性对比后自然会返回true。

验证方法 #

你可以在shouldComponentUpdate中加入以下日志验证核心逻辑：

console.log(nextProps.dispatch === this.props.dispatch) // 预期返回true
console.log(nextProps.saveHeaderSettings === this.props.saveHeaderSettings) // 预期返回true

如果上述两个对比都返回true，就说明函数引用本身是稳定的，_.isEqual返回true是正常结果。 #

内容的提问来源于stack exchange，提问作者kenanyildiz90