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;
}

你可能感兴趣的:(redux-action之createAction.js源码解读(自我理解))