Redux源碼(一) —— index.js

Preface

如今都9012了，還談redux源碼，是否是太晚了？回答是，但又不是，畢竟不寫出來只會是更晚。

當前版本爲redux@4.0.1，可能會根據版本不一樣存在些許差別，不過不影響。

Directory

src
|---- utils
|    |---- actionTypes.js
|    |---- isPlainObject.js
|    |---- warning.js
|---- applyMiddle.js
|---- bindActionCreator.js
|---- combineReducers.js
|---- compose.js
|---- createStore.js
|---- index.js
複製代碼

Analysis

utils

actionTypes.js

actionTypes.js保存了redux中的一些私有action類型，根據名稱也很好理解，這裏就不過多贅述了。

const randomString = () =>
  Math.random()
    .toString(36)
    .substring(7)
    .split('')
    .join('.')

const ActionTypes = {
  INIT: `@@redux/INIT${randomString()}`,
  REPLACE: `@@redux/REPLACE${randomString()}`,
  PROBE_UNKNOWN_ACTION: () => `@@redux/PROBE_UNKNOWN_ACTION${randomString()}`
}
export default ActionTypes
複製代碼

isPlainObject.js

isPlainObject.js用於判斷是不是一個簡單對象，這裏簡單的意思是指是不是單純的object，如數組、函數等就不是，主要依靠的是Object.getPrototypeOf獲取當前對象的原型，經過當前對象的直接原型和最終原型（即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
}
複製代碼

warning.js

warning.js用於提供一個顯示警告信息的通用方法，接受一條錯誤信息，若是支持console.error則會先使用這條命令打印警告信息，再拋出一個Error，不過會在方法中被catch掉，沒有其餘操做。

export default function warning(message) {
  if (typeof console !== 'undefined' && typeof console.error === 'function') {
    console.error(message)
  }
  try {
    throw new Error(message)
  } catch (e) {}
}
複製代碼

index.js

index.js是redux的入口文件，主要負責判斷當前是不是正確的生產環境版本，以及最主要的：向用戶提供api，如基本的createStore就是在這裏導出給用戶的。

import createStore from './createStore'
import combineReducers from './combineReducers'
import bindActionCreators from './bindActionCreators'
import applyMiddleware from './applyMiddleware'
import compose from './compose'
import warning from './utils/warning'
import __DO_NOT_USE__ActionTypes from './utils/actionTypes'

// ... 此處省略了判斷環境以及版本的警告提示

export {
  createStore,
  combineReducers,
  bindActionCreators,
  applyMiddleware,
  compose,
  __DO_NOT_USE__ActionTypes
}
複製代碼

All

• index
• compose
• applyMiddleware
• bindActionCreators
• combineReducers
• createStore