export default function shallowEqual(objA, objB) {

   if (objA === objB) {

     return true

   }

   const keysA = Object.keys(objA)

   const keysB = Object.keys(objB)

   if (keysA.length !== keysB.length) {

     return false

   }

   // Test for A's keys different from B.

   const hasOwn = Object.prototype.hasOwnProperty

   for (let i = 0; i < keysA.length; i++) {

     if (!hasOwn.call(objB, keysA[i]) ||

         objA[keysA[i]] !== objB[keysA[i]]) {

       return false

     }

   }

   return true

 }

 import { PropTypes } from 'react'

 export default PropTypes.shape({

   subscribe: PropTypes.func.isRequired,

   dispatch: PropTypes.func.isRequired,

   getState: PropTypes.func.isRequired

 })

 /**

  * Prints a warning in the console if it exists.

  *

  * @param {String} message The warning message.

  * @returns {void}

  */

 export default function warning(message) {

   /* eslint-disable no-console */

   if (typeof console !== 'undefined' && typeof console.error === 'function') {

     console.error(message)

   }

   /* eslint-enable no-console */

   try {

     // This error was thrown as a convenience so that if you enable

     // "break on all exceptions" in your console,

     // it would pause the execution at this line.

     throw new Error(message)

     /* eslint-disable no-empty */

   } catch (e) {}

   /* eslint-enable no-empty */

 }

 import { bindActionCreators } from 'redux'

 export default function wrapActionCreators(actionCreators) {

   return dispatch => bindActionCreators(actionCreators, dispatch)

 }

 import { Component, PropTypes, Children } from 'react'

 import storeShape from '../utils/storeShape'

 import warning from '../utils/warning'

 let didWarnAboutReceivingStore = false

 function warnAboutReceivingStore() {

   if (didWarnAboutReceivingStore) {

     return

   }

   didWarnAboutReceivingStore = true

   warning(

     '<Provider> does not support changing `store` on the fly. ' +

     'It is most likely that you see this error because you updated to ' +

     'Redux 2.x and React Redux 2.x which no longer hot reload reducers ' +

     'automatically. See https://github.com/reactjs/react-redux/releases/' +

     'tag/v2.0.0 for the migration instructions.'

   )

 }

 export default class Provider extends Component {

     //关键部分，将this.store加到了context里，这里，子组件就可以通过context直接拿到store，不需要一级一级props传递下去。

   getChildContext() {

     return { store: this.store }

   }

   constructor(props, context) {

     super(props, context)

     this.store = props.store

   }

   render() {

     return Children.only(this.props.children)

   }

 }

 if (process.env.NODE_ENV !== 'production') {

   Provider.prototype.componentWillReceiveProps = function (nextProps) {

     const { store } = this

     const { store: nextStore } = nextProps

     if (store !== nextStore) {

       warnAboutReceivingStore()

     }

   }

 }

 Provider.propTypes = {
     //要求我们的 store对象里面的3个必须是func

   store: storeShape.isRequired,

    //要求我们形如这种格式的 <Provider store={store}> <App/> </Provider> ，<App>必须是react的element，其实它还要求了只能是放单element的，这也是render这个本身限定的！！可以看上面的Children.Only()

   children: PropTypes.element.isRequired

 }
    // 这个是和getChildContext一样，必须加的。

   //访问context 的属性是需要通过 contextTypes 指定可访问的 元素一样。getChildContext 指定的传递给子组件的属性需要先通过 childContextTypes 来指定，不然会产生错误。

 Provider.childContextTypes = {

   store: storeShape.isRequired

 }

 import { Component, createElement } from 'react'

 import storeShape from '../utils/storeShape'

 import shallowEqual from '../utils/shallowEqual'

 import wrapActionCreators from '../utils/wrapActionCreators'

 import warning from '../utils/warning'

 import isPlainObject from 'lodash/isPlainObject'

 import hoistStatics from 'hoist-non-react-statics'

 import invariant from 'invariant'

     //一直到return 我都认为是废话，函数名字都是顾名思义的。。直接忽略。。。。

 const defaultMapStateToProps = state => ({}) // eslint-disable-line no-unused-vars

 const defaultMapDispatchToProps = dispatch => ({ dispatch })

 const defaultMergeProps = (stateProps, dispatchProps, parentProps) => ({

   ...parentProps,

   ...stateProps,

   ...dispatchProps

 })

 function getDisplayName(WrappedComponent) {

   return WrappedComponent.displayName || WrappedComponent.name || 'Component'

 }

 let errorObject = { value: null }

 function tryCatch(fn, ctx) {

   try {

     return fn.apply(ctx)

   } catch (e) {

     errorObject.value = e

     return errorObject

   }

 }

    // 重点开始了。。。。。。

 // Helps track hot reloading.

 let nextVersion = 0

 export default function connect(mapStateToProps, mapDispatchToProps, mergeProps, options = {}) {

      //这里是否应该被订阅？嗯哼，回想一下store里的 subcribe，每次被dispacth 的时候就会执行！！！，这里估计就是给一个标志，
      //如果传了mapStateToProps,必然是true，反之是false;

   const shouldSubscribe = Boolean(mapStateToProps)
 

   const mapState = mapStateToProps || defaultMapStateToProps

   let mapDispatch

   if (typeof mapDispatchToProps === 'function') {

     mapDispatch = mapDispatchToProps

   } else if (!mapDispatchToProps) {

     mapDispatch = defaultMapDispatchToProps

   } else {

     mapDispatch = wrapActionCreators(mapDispatchToProps)

   }

   const finalMergeProps = mergeProps || defaultMergeProps

   const { pure = true, withRef = false } = options

   const checkMergedEquals = pure && finalMergeProps !== defaultMergeProps

   // Helps track hot reloading.

   const version = nextVersion++

   return function wrapWithConnect(WrappedComponent) {

                  // 如果沒有為app添加disPlayName 或者 name  返回 "Conponent"

     const connectDisplayName = `Connect(${getDisplayName(WrappedComponent)})`

     function checkStateShape(props, methodName) {

       if (!isPlainObject(props)) {

         warning(

           `${methodName}() in ${connectDisplayName} must return a plain object. ` +

           `Instead received ${props}.`

         )

       }

     }

     function computeMergedProps(stateProps, dispatchProps, parentProps) {

       const mergedProps = finalMergeProps(stateProps, dispatchProps, parentProps)

       if (process.env.NODE_ENV !== 'production') {

         checkStateShape(mergedProps, 'mergeProps')

       }

       return mergedProps

     }

     class Connect extends Component {

       shouldComponentUpdate() {

         return !pure || this.haveOwnPropsChanged || this.hasStoreStateChanged

       }

       constructor(props, context) {

         super(props, context)

         this.version = version

         this.store = props.store || context.store

         invariant(this.store,

           `Could not find "store" in either the context or ` +

           `props of "${connectDisplayName}". ` +

           `Either wrap the root component in a <Provider>, ` +

           `or explicitly pass "store" as a prop to "${connectDisplayName}".`

         )

         const storeState = this.store.getState()

         this.state = { storeState }

         this.clearCache()

       }

       computeStateProps(store, props) {

         if (!this.finalMapStateToProps) {

           return this.configureFinalMapState(store, props)

         }

         const state = store.getState()

         const stateProps = this.doStatePropsDependOnOwnProps ?

           this.finalMapStateToProps(state, props) :

           this.finalMapStateToProps(state)

         if (process.env.NODE_ENV !== 'production') {

           checkStateShape(stateProps, 'mapStateToProps')

         }

         return stateProps

       }

       configureFinalMapState(store, props) {

         const mappedState = mapState(store.getState(), props)

         const isFactory = typeof mappedState === 'function'

         this.finalMapStateToProps = isFactory ? mappedState : mapState

         this.doStatePropsDependOnOwnProps = this.finalMapStateToProps.length !== 1

         if (isFactory) {

           return this.computeStateProps(store, props)

         }

         if (process.env.NODE_ENV !== 'production') {

           checkStateShape(mappedState, 'mapStateToProps')

         }

         return mappedState

       }

       computeDispatchProps(store, props) {

         if (!this.finalMapDispatchToProps) {

           return this.configureFinalMapDispatch(store, props)

         }

         const { dispatch } = store

         const dispatchProps = this.doDispatchPropsDependOnOwnProps ?

           this.finalMapDispatchToProps(dispatch, props) :

           this.finalMapDispatchToProps(dispatch)

         if (process.env.NODE_ENV !== 'production') {

           checkStateShape(dispatchProps, 'mapDispatchToProps')

         }

         return dispatchProps

       }

       configureFinalMapDispatch(store, props) {

         const mappedDispatch = mapDispatch(store.dispatch, props)

         const isFactory = typeof mappedDispatch === 'function'

         this.finalMapDispatchToProps = isFactory ? mappedDispatch : mapDispatch

         this.doDispatchPropsDependOnOwnProps = this.finalMapDispatchToProps.length !== 1

         if (isFactory) {

           return this.computeDispatchProps(store, props)

         }

         if (process.env.NODE_ENV !== 'production') {

           checkStateShape(mappedDispatch, 'mapDispatchToProps')

         }

         return mappedDispatch

       }

       updateStatePropsIfNeeded() {

         const nextStateProps = this.computeStateProps(this.store, this.props)

         if (this.stateProps && shallowEqual(nextStateProps, this.stateProps)) {

           return false

         }

         this.stateProps = nextStateProps

         return true

       }

       updateDispatchPropsIfNeeded() {

         const nextDispatchProps = this.computeDispatchProps(this.store, this.props)

         if (this.dispatchProps && shallowEqual(nextDispatchProps, this.dispatchProps)) {

           return false

         }

         this.dispatchProps = nextDispatchProps

         return true

       }

       updateMergedPropsIfNeeded() {

         const nextMergedProps = computeMergedProps(this.stateProps, this.dispatchProps, this.props)

         if (this.mergedProps && checkMergedEquals && shallowEqual(nextMergedProps, this.mergedProps)) {

           return false

         }

         this.mergedProps = nextMergedProps

         return true

       }

       isSubscribed() {

         return typeof this.unsubscribe === 'function'

       }

       trySubscribe() {

         if (shouldSubscribe && !this.unsubscribe) {

           this.unsubscribe = this.store.subscribe(this.handleChange.bind(this))

           this.handleChange()

         }

       }

       tryUnsubscribe() {

         if (this.unsubscribe) {

           this.unsubscribe()

           this.unsubscribe = null

         }

       }

       componentDidMount() {

         this.trySubscribe()

       }

       componentWillReceiveProps(nextProps) {

         if (!pure || !shallowEqual(nextProps, this.props)) {

           this.haveOwnPropsChanged = true

         }

       }

       componentWillUnmount() {

         this.tryUnsubscribe()

         this.clearCache()

       }

       clearCache() {

         this.dispatchProps = null

         this.stateProps = null

         this.mergedProps = null

         this.haveOwnPropsChanged = true

         this.hasStoreStateChanged = true

         this.haveStatePropsBeenPrecalculated = false

         this.statePropsPrecalculationError = null

         this.renderedElement = null

         this.finalMapDispatchToProps = null

         this.finalMapStateToProps = null

       }

       handleChange() {

         if (!this.unsubscribe) {

           return

         }

         const storeState = this.store.getState()

         const prevStoreState = this.state.storeState

         if (pure && prevStoreState === storeState) {

           return

         }

         if (pure && !this.doStatePropsDependOnOwnProps) {

           const haveStatePropsChanged = tryCatch(this.updateStatePropsIfNeeded, this)

           if (!haveStatePropsChanged) {

             return

           }

           if (haveStatePropsChanged === errorObject) {

             this.statePropsPrecalculationError = errorObject.value

           }

           this.haveStatePropsBeenPrecalculated = true

         }

         this.hasStoreStateChanged = true

         this.setState({ storeState })

       }

       getWrappedInstance() {

         invariant(withRef,

           `To access the wrapped instance, you need to specify ` +

           `{ withRef: true } as the fourth argument of the connect() call.`

         )

         return this.refs.wrappedInstance

       }

       render() {

         const {

           haveOwnPropsChanged,

           hasStoreStateChanged,

           haveStatePropsBeenPrecalculated,

           statePropsPrecalculationError,

           renderedElement

         } = this

         this.haveOwnPropsChanged = false

         this.hasStoreStateChanged = false

         this.haveStatePropsBeenPrecalculated = false

         this.statePropsPrecalculationError = null

         if (statePropsPrecalculationError) {

           throw statePropsPrecalculationError

         }

         let shouldUpdateStateProps = true

         let shouldUpdateDispatchProps = true

         if (pure && renderedElement) {

           shouldUpdateStateProps = hasStoreStateChanged || (

             haveOwnPropsChanged && this.doStatePropsDependOnOwnProps

           )

           shouldUpdateDispatchProps =

             haveOwnPropsChanged && this.doDispatchPropsDependOnOwnProps

         }

         let haveStatePropsChanged = false

         let haveDispatchPropsChanged = false

         if (haveStatePropsBeenPrecalculated) {

           haveStatePropsChanged = true

         } else if (shouldUpdateStateProps) {

           haveStatePropsChanged = this.updateStatePropsIfNeeded()

         }

         if (shouldUpdateDispatchProps) {

           haveDispatchPropsChanged = this.updateDispatchPropsIfNeeded()

         }

         let haveMergedPropsChanged = true

         if (

           haveStatePropsChanged ||

           haveDispatchPropsChanged ||

           haveOwnPropsChanged

         ) {

           haveMergedPropsChanged = this.updateMergedPropsIfNeeded()

         } else {

           haveMergedPropsChanged = false

         }

         if (!haveMergedPropsChanged && renderedElement) {

           return renderedElement

         }

         if (withRef) {

           this.renderedElement = createElement(WrappedComponent, {

             ...this.mergedProps,

             ref: 'wrappedInstance'

           })

         } else {

           this.renderedElement = createElement(WrappedComponent,

             this.mergedProps

           )

         }

         return this.renderedElement

       }

     }

     Connect.displayName = connectDisplayName

     Connect.WrappedComponent = WrappedComponent

     Connect.contextTypes = {

       store: storeShape

     }

     Connect.propTypes = {

       store: storeShape

     }

     if (process.env.NODE_ENV !== 'production') {

       Connect.prototype.componentWillUpdate = function componentWillUpdate() {

         if (this.version === version) {

           return

         }

         // We are hot reloading!

         this.version = version

         this.trySubscribe()

         this.clearCache()

       }

     }

     return hoistStatics(Connect, WrappedComponent)

   }

 }

             constructor(props, context) {

                 super(props, context)

                 this.version = version

                 //来了！来了！ context.store也加到了Connect里啦！！这样就保证了Provider和connect里公用了一个store!

                 this.store = props.store || context.store

                 //这个函数的代码直接忽略好了

                 invariant(this.store,

                     `Could not find "store" in either the context or ` +

                     `props of "${connectDisplayName}". ` +

                     `Either wrap the root component in a <Provider>, ` +

                     `or explicitly pass "store" as a prop to "${connectDisplayName}".`

                 )

                 //获取当前state

                 const storeState = this.store.getState()

                 //注意看  this.state，可想而知，之后会在某个地方调用setState 更新视图。整个React-redux项目，将会在connect这里发起更新视图的发起点，因为这里的才有state,子组件我们都是通过props传下去的

                 this.state = { storeState }

                 this.clearCache()   //这里初始化一些connect的实例属性。里面的具体属性自己看源码，他们的用途，在接下来的用到的时候再讲

             }