redux-action之createAction.js源碼解讀（自我理解）

createAction 先了解一下這個文件是作什麼的？

從單詞字面意思能看出是建立一個action的，接下來咱們看一下源碼中主要作了寫什麼操做：

//使用invariant()方法來斷言程序假定爲true的狀態，提供有關內容和預期內容的信息，
//將錯誤信息以throw的形式拋出
import invariant from 'invariant';
//判斷某個參數typeof 是否爲function ->return typeof value === 'function'
import isFunction from './utils/isFunction';
//返回一個匿名函數 ƒ (value) { return value;}
import identity from './utils/identity';
//判斷某個參數是否爲null ->return value === null;
import isNull from './utils/isNull';

/** * 建立action * @param type action的類型 * @param payloadCreator 須要建立的action,函數 * @param metaCreator action的屬性 * @returns {Function} */
export default function createAction( type, payloadCreator = identity, metaCreator ) {
 /** * 用來判斷payloadCreator是不是function、undefined、null其中之一， * 也就是說payloadCreator只接受前面三種之一 */
  invariant(
    isFunction(payloadCreator) || isNull(payloadCreator),
    'Expected payloadCreator to be a function, undefined or null'
  );

  /** * 經過傳入參數獲得最終payloadCreator * 若是payloadCreator是null或者沒有做爲參數傳入，將identity返回 * 不然返回一個匿名函數，用來計算finalPayloadCreator()執行後的結果 * 函數執行後可能的返回值：identity()、Error對象、payloadCreator(head, ...args)執行結果 */
  const finalPayloadCreator =
    isNull(payloadCreator) || payloadCreator === identity
      ? identity
      : (head, ...args) =>
          head instanceof Error ? head : payloadCreator(head, ...args);

  const hasMeta = isFunction(metaCreator);
  const typeString = type.toString();

  /** * actionCreator 是要createAction最終返回的一個函數 * 它的值是一個匿名函數，也就是擁有閉包的特性，再也不贅述 * 該函數會在store.dispath(action)時執行 */
  const actionCreator = (...args) => {
    /** * 當actionCreator函數做爲createAction結果返回後 * payload是finalPayloadCreator(...args)執行後的結果，也就是處理後的數據部分 */
    const payload = finalPayloadCreator(...args);

    //action最終會包含的參數：type、payload、error、meta 
    const action = { type };

    //參考上面finalPayloadCreator()返回值
    if (payload instanceof Error) {
      action.error = true;
    }

    if (payload !== undefined) {
      action.payload = payload;
    }

    if (hasMeta) {
      action.meta = metaCreator(...args);
    }

    return action;
  };

  actionCreator.toString = () => typeString;

  return actionCreator;
}
複製代碼