@zcrkey/js-utils 0.0.3 → 0.0.5

package/docs/api/util/is.tsx

@@ -0,0 +1,196 @@
+/**
+ * title: isXxx 判断
+ */
+
+import { CrUtil } from '@zcrkey/js-utils';
+import React, { useEffect, useState } from 'react';
+
+const number = 1;
+const emptyString = '';
+const string = 'zcr';
+const date = new Date();
+const sin = Math.sin;
+const _null = null;
+const _undefined = undefined;
+const boolean = true;
+const emptyArray: never[] = [];
+const emptyObject = {};
+const object = {
+  number: 1,
+  string: 'zcr',
+  obj: {},
+  arr: [],
+};
+const array = [1, 'zcr', {}, []];
+
+export default () => {
+  const [result, setResult] = useState<any>({});
+
+  useEffect(() => {
+    let value: any = [];
+    let other: { name: string } | { name: string }[] = value;
+    if (CrUtil.isObject(other)) {
+      other.name; // other 的类型为 { name: string }
+    }
+    if (CrUtil.isArray(other)) {
+      other[0]?.name; // other 的类型为 { name: string }[]
+    }
+  });
+
+  const isArray = () => {
+    let res: any[] = [];
+    if (CrUtil.isArray(emptyArray)) {
+      res.push(`${JSON.stringify(emptyArray)}：是数组`);
+    }
+    if (CrUtil.isArray(array)) {
+      res.push(`${JSON.stringify(array)}：是数组`);
+    }
+    if (!CrUtil.isArray(emptyString)) {
+      res.push(`${JSON.stringify(emptyString)}： 不是数组`);
+    }
+    if (!CrUtil.isArray(number)) {
+      res.push(`${JSON.stringify(number)}： 不是数组`);
+    }
+    if (!CrUtil.isArray(_null)) {
+      res.push(`${JSON.stringify(_null)}： 不是数组`);
+    }
+    if (!CrUtil.isArray(_undefined)) {
+      res.push(`${JSON.stringify(_undefined)}： 不是数组`);
+    }
+    setResult({
+      ...result,
+      isArray: res,
+    });
+  };
+
+  const isObject = () => {
+    let res: any[] = [];
+    if (CrUtil.isObject(emptyObject)) {
+      res.push(`${JSON.stringify(emptyObject)}：是对象`);
+    }
+    if (CrUtil.isObject(object)) {
+      res.push(`${JSON.stringify(object)}：是对象`);
+    }
+    if (CrUtil.isObject(date)) {
+      res.push(`new Date()： 是对象`);
+    }
+    if (!CrUtil.isObject(array)) {
+      res.push(`${JSON.stringify(array)}： 不是对象`);
+    }
+    if (!CrUtil.isObject(_null)) {
+      res.push(`${JSON.stringify(_null)}： 不是对象`);
+    }
+    if (!CrUtil.isObject(_undefined)) {
+      res.push(`${JSON.stringify(_undefined)}： 不是对象`);
+    }
+    if (!CrUtil.isObject(sin)) {
+      res.push(`Math.sin： 不是对象`);
+    }
+    setResult({
+      ...result,
+      isObject: res,
+    });
+  };
+
+  const isEmptyObject = () => {
+    let res: any[] = [];
+    if (CrUtil.isEmptyObject(emptyObject)) {
+      res.push(`${JSON.stringify(emptyObject)}：是空对象`);
+    }
+    if (!CrUtil.isEmptyObject(object)) {
+      res.push(`${JSON.stringify(object)}： 不是空对象`);
+    }
+
+    setResult({
+      ...result,
+      isEmptyObject: res,
+    });
+  };
+
+  return (
+    <>
+      <div className="flex flex-direction">
+        <div>判断是否为数组</div>
+        <div className="text-lg">CrUtil.isArray</div>
+        <div>
+          <button
+            type="button"
+            className="cr-btn line-blue radius"
+            onClick={isArray}
+          >
+            调用
+          </button>
+          <div>
+            {result.isArray &&
+              result.isArray.map((str: string) => {
+                return <div key={str}>{str}</div>;
+              })}
+          </div>
+        </div>
+      </div>
+
+      <div className="divider"></div>
+
+      <div className="flex flex-direction">
+        <div>判断是否为对象</div>
+        <div className="text-lg">CrUtil.isObject</div>
+        <div>
+          <button
+            type="button"
+            className="cr-btn line-blue radius"
+            onClick={isObject}
+          >
+            调用
+          </button>
+          <div>
+            {result.isObject &&
+              result.isObject.map((str: string) => {
+                return <div key={str}>{str}</div>;
+              })}
+          </div>
+        </div>
+      </div>
+
+      <div className="divider"></div>
+
+      <div className="flex flex-direction">
+        <div>判断是否为空对象</div>
+        <div className="text-lg">CrUtil.isEmptyObject</div>
+        <div>
+          <button
+            type="button"
+            className="cr-btn line-blue radius"
+            onClick={isEmptyObject}
+          >
+            调用
+          </button>
+          <div>
+            {result.isEmptyObject &&
+              result.isEmptyObject.map((str: string) => {
+                return <div key={str}>{str}</div>;
+              })}
+          </div>
+        </div>
+      </div>
+
+      <div className="divider"></div>
+
+      <div className="flex flex-direction margin-bottom">
+        <div>判断是否对象的属性是否全部为空</div>
+        <div className="text-lg margin-bottom">
+          CrUtil.isObjectPropertiesAllEmpty
+        </div>
+        <div>判断是否为日期</div>
+        <div className="text-lg margin-bottom">CrUtil.isDate</div>
+        <div>判断是否为字符串</div>
+        <div className="text-lg margin-bottom">CrUtil.isString</div>
+        <div>判断是否为数字</div>
+        <div className="text-lg margin-bottom">CrUtil.isNumber</div>
+        <div>判断是否为文件 File</div>
+        <div className="text-lg margin-bottom">CrUtil.isFile</div>
+        <div>判断是否为 Boolean</div>
+        <div className="text-lg margin-bottom">CrUtil.isBoolean</div>
+      </div>
+    </>
+  );
+};

package/docs/guide.md

@@ -0,0 +1,24 @@
+# @zcrkey/js-utils
+
+<!-- [![NPM version](https://img.shields.io/npm/v/js-utils.svg?style=flat)](https://g-nhxn7953.coding.net/public-artifacts/zcrkey/npm/@zcrkey/js-utils/version/40193242/overview)
+[![NPM downloads](http://img.shields.io/npm/dm/js-utils.svg?style=flat)](https://g-nhxn7953.coding.net/public-artifacts/zcrkey/npm/@zcrkey/js-utils/version/40193242/overview) -->
+
+一个 javascript 实用函数库
+
+## git 规范
+
+- feat: 新增特性 (feature)
+- fix: 修复 Bug(bug fix)
+- docs: 修改文档 (documentation)
+- style: 代码格式修改(white-space, formatting, missing semi colons, etc)
+- refactor: 代码重构(refactor)
+- perf: 改善性能(A code change that improves performance)
+- test: 测试(when adding missing tests)
+- build: 变更项目构建或外部依赖（例如 scopes: webpack、gulp、npm 等）
+- ci: 更改持续集成软件的配置文件和 package 中的 scripts 命令，例如 scopes: Travis, Circle 等
+- chore: 变更构建流程或辅助工具(比如更改测试环境)
+- revert: 代码回退
+
+## LICENSE
+
+MIT

package/package.json

@@ -1,18 +1,20 @@
 {
   "name": "@zcrkey/js-utils",
-  "version": "0.0.3",
+  "version": "0.0.5",
   "description": "一个 javascript 实用函数库",
   "keywords": [
     "js"
   ],
+  "repository": {
+    "type": "git",
+    "url": "https://cnb.cool/cnbkey/zcrkey/js-utils.git"
+  },
   "license": "MIT",
   "main": "dist/index.umd.js",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",
-  "files": [
-    "dist"
-  ],
   "dependencies": {
+    "lodash": "^4.17.21",
     "qs": "^6.11.2"
   },
   "publishConfig": {

package/src/eventCenter.ts

@@ -0,0 +1,112 @@
+export type TSubscribers = {
+  key: string;
+  listeners: Array<(...args: any) => void>;
+};
+
+export type TSubscription = {
+  key: string;
+  listener: (...args: any) => void;
+  remove: () => void;
+};
+
+export default class CrEventCenter {
+  /**
+   * 储存订阅者
+   */
+  static subscribers: TSubscribers[] = [];
+
+  /**
+   * 新增订阅
+   *
+   * @param {*} key 名称
+   * @param {*} listener 执行函数
+   * @returns 订阅信息
+   * @example
+     this.subscription = CrEventCenter.on('名称', (参数) => {});
+   */
+  static on(key: string, listener: (...args: any) => void): TSubscription {
+    const subscriber = this.subscribers.find((item) => item.key == key);
+    if (subscriber) {
+      subscriber.listeners.push(listener);
+    } else {
+      this.subscribers.push({
+        key: key,
+        listeners: [listener],
+      });
+    }
+    let subscription: TSubscription = {
+      key: key,
+      listener: listener,
+      remove: () => {
+        this.off(subscription);
+      },
+    };
+    return subscription;
+  }
+
+  /**
+   * 移除订阅
+   *
+   * @param {*} subscription 
+   * @param {*} type 'all'  
+   * @example
+     CrEventCenter.off(this.subscription);
+   */
+  static off(subscription: TSubscription, type?: 'all') {
+    const index = this.subscribers.findIndex(
+      (item) => item.key == subscription.key,
+    );
+    if (index > -1) {
+      if (type == 'all') {
+        this.subscribers.splice(index, 1);
+      } else {
+        const subscriber = this.subscribers[index];
+        const _index = subscriber.listeners.findIndex(
+          (item) => item == subscription.listener,
+        );
+        if (_index > -1) {
+          subscriber.listeners.splice(_index, 1);
+        }
+      }
+    }
+  }
+
+  /**
+   * 派发事件
+   *
+   * @param {*} key 名称
+   * @param {*} args 其余参数
+   * @example
+     CrEventCenter.emit('名称', 参数数据);
+   */
+  static emit(key: string, ...args: any) {
+    const subscriber = this.subscribers.find((item) => item.key == key);
+    if (subscriber && subscriber.listeners && subscriber.listeners.length > 0) {
+      subscriber.listeners.forEach((listener) => {
+        listener(...args);
+      });
+    }
+  }
+
+  /**
+   * 查找事件
+   *
+   * @param {*} key 名称
+   * @example
+    let subscriber = CrEventCenter.find('名称');
+   */
+  static find(key: string): TSubscribers | undefined {
+    return this.subscribers.find((item) => item.key == key);
+  }
+
+  /**
+   * 清理所有事件
+   *
+   * @memberof CrEventCenter
+   * @example
+     CrEventCenter.clear();
+   */
+  static clear() {
+    this.subscribers.length = 0;
+  }
+}

package/src/index.ts

@@ -0,0 +1,8 @@
+export type * from './eventCenter';
+export { default as CrEventCenter } from './eventCenter';
+export type * from './objUtil';
+export { default as CrObjUtil } from './objUtil';
+export { default as CrStorage } from './storage';
+export type * from './treeUtil';
+export { default as CrTreeUtil } from './treeUtil';
+export { default as CrUtil } from './util';

package/src/objUtil.ts

@@ -0,0 +1,20 @@
+import { get, PropertyPath } from 'lodash';
+
+export type { PropertyPath };
+
+export default class CrObjUtil {
+  /**
+   * 根据字段路径获取对象值
+   * @param obj { 'a': [{ 'b': { 'c': 3 } }] }
+   * @param path 'a[0].b.c' | ['a', '0', 'b', 'c']
+   * @param defaultValue 找不到时返回的默认值
+   * @returns
+   */
+  static getValueByPath(
+    obj: Record<string | number | symbol, any>,
+    propertyPath: PropertyPath,
+    defaultValue?: any,
+  ) {
+    return get(obj, propertyPath, defaultValue);
+  }
+}

package/src/storage.ts

@@ -0,0 +1,101 @@
+export default class CrStorage {
+  /**
+   * 设置本地存储
+   * @param key
+   * @param data
+   */
+  static setLocalItem(key: string, data: any) {
+    try {
+      localStorage.setItem(key, JSON.stringify(data));
+    } catch (error) {
+      console.warn(`setLocalItem:${key}:${error}`);
+    }
+  }
+
+  /**
+   * 获取本地存储
+   * @param key
+   * @returns
+   */
+  static getLocalItem<T = any>(key: string): T | null {
+    const str = localStorage.getItem(key);
+    if (str) {
+      if (str === 'undefined') {
+        return null;
+      }
+      try {
+        return JSON.parse(str);
+      } catch (error) {
+        console.warn(`getLocalItem:${key}:${error}`);
+        return null;
+      }
+    } else {
+      return null;
+    }
+  }
+
+  /**
+   * 清除某个本地存储
+   * @param key
+   */
+  static removeLocalItem(key: string) {
+    localStorage.removeItem(key);
+  }
+
+  /**
+   * 清除所有本地存储
+   */
+  static clearLocal() {
+    localStorage.clear();
+  }
+
+  /**
+   * 设置会话存储
+   * @param key
+   * @param data
+   */
+  static setSessionItem(key: string, data: any) {
+    try {
+      sessionStorage.setItem(key, JSON.stringify(data));
+    } catch (error) {
+      console.warn(`setSessionItem:${key}:${error}`);
+    }
+  }
+
+  /**
+   * 获取会话存储
+   * @param key
+   * @returns
+   */
+  static getSessionItem<T = any>(key: string): T | null {
+    const str = sessionStorage.getItem(key);
+    if (str) {
+      if (str === 'undefined') {
+        return null;
+      }
+      try {
+        return JSON.parse(str);
+      } catch (error) {
+        console.warn(`getSessionItem:${key}:${error}`);
+        return null;
+      }
+    } else {
+      return null;
+    }
+  }
+
+  /**
+   * 清除某个会话存储
+   * @param key
+   */
+  static removeSessionItem(key: string) {
+    sessionStorage.removeItem(key);
+  }
+
+  /**
+   * 清除所有会话存储
+   */
+  static clearSession() {
+    sessionStorage.clear();
+  }
+}

package/src/treeUtil.ts

@@ -0,0 +1,164 @@
+import {
+  cloneDeep as _cloneDeep,
+  find as _find,
+  get as _get,
+  keyBy as _keyBy,
+} from 'lodash';
+
+export default class CrTreeUtil {
+  /**
+   * 列表数据转树形数据
+   * @param list
+   * @param options
+   * @param options.idField 默认值 id
+   * @param options.parentIdField 默认值 parentId
+   * @param options.childrenField 默认值 children
+   * @param options.isCloneDeep 是否需要深拷贝, 默认值为 true
+   * @param options.getData 处理数据
+   * @returns
+   */
+  static listToTree<T extends Record<string, any>>(
+    list: T[],
+    options?: {
+      idField?: string;
+      parentIdField?: string;
+      childrenField?: string;
+      isCloneDeep?: boolean;
+      getData?: (item: T) => any;
+    },
+  ): any[] {
+    const {
+      idField = 'id',
+      parentIdField = 'parentId',
+      childrenField = 'children',
+      isCloneDeep = true,
+      getData = (item: T) => item,
+    } = options || {};
+
+    const listData = isCloneDeep ? _cloneDeep(list) : list;
+    const treeData: any[] = [];
+    const nodeMap = new Map<string | number, any>();
+
+    for (const item of listData) {
+      const id = item[idField];
+      const node = {
+        ...getData(item),
+        __origin_id: id,
+        __origin_pid: item[parentIdField],
+      };
+      nodeMap.set(id, node);
+    }
+
+    for (const node of nodeMap.values()) {
+      const parentId = node.__origin_pid;
+      if (
+        parentId === undefined ||
+        parentId === null ||
+        parentId === 0 ||
+        !nodeMap.has(parentId)
+      ) {
+        treeData.push(node);
+      } else {
+        const parentNode = nodeMap.get(parentId);
+        if (!parentNode[childrenField]) {
+          parentNode[childrenField] = [];
+        }
+        parentNode[childrenField].push(node);
+      }
+    }
+
+    const clean = (nodes: any[]) => {
+      for (const node of nodes) {
+        delete node.__origin_id;
+        delete node.__origin_pid;
+        if (node[childrenField]) {
+          clean(node[childrenField]);
+        }
+      }
+    };
+    clean(treeData);
+
+    return treeData;
+  }
+
+  /**
+   * 树形数据转列表数据
+   * @param tree
+   * @param options
+   * @param options.childrenField 默认值 children
+   * @param options.isCloneDeep 是否需要深拷贝, 默认值为 true
+   * @returns
+   */
+  static treeToList<T extends Record<string, any>>(
+    tree: T[],
+    options?: {
+      childrenField?: string;
+      isCloneDeep?: boolean;
+    },
+  ) {
+    const { childrenField = 'children', isCloneDeep = true } = options || {};
+    const result: T[] = [];
+    const queue: T[] = [...tree];
+    while (queue.length) {
+      const node = queue.shift()!;
+      const children = node[childrenField];
+      const { [childrenField]: _, ...rest } = node;
+      result.push(rest as T);
+      if (children && children.length) {
+        queue.push(...children);
+      }
+    }
+
+    return isCloneDeep ? _cloneDeep(result) : result;
+  }
+
+  /**
+   * 获取扁平化父数据(包含自身)
+   * @param listData
+   * @param value
+   * @param settings
+   * @param settings.valueField 默认值 value
+   * @param settings.idField 默认值 id
+   * @param settings.parentIdField 默认值 parentId
+   * @param settings.getData 过滤数据
+   */
+  static getFlatParentDatas<T = any, R extends Record<string, any> = any>(
+    listData: R[],
+    value: number | string,
+    settings?: {
+      valueField?: string;
+      idField?: string;
+      parentIdField?: string;
+      getData?: (item: R) => T;
+    },
+  ): T[] {
+    if (!Array.isArray(listData) || listData.length === 0 || value == null) {
+      return [];
+    }
+    const options = Object.assign(
+      {
+        valueField: 'value',
+        idField: 'id',
+        parentIdField: 'parentId',
+        getData: (item: R): T => {
+          return item as unknown as T;
+        },
+      },
+      settings,
+    );
+    const nodeMap = _keyBy(listData, options.valueField);
+    const result: T[] = [];
+    const visited = new Set();
+    let current: R | undefined = nodeMap[value];
+    while (current && !visited.has(_get(current, options.idField))) {
+      visited.add(_get(current, options.idField));
+      result.unshift(options.getData(current));
+      const parentId: string | number | undefined | null = _get(
+        current,
+        options.parentIdField,
+      );
+      current = _find(listData, [options.valueField, parentId]);
+    }
+    return result;
+  }
+}