JavaScript 常用功能、函数、工具库

JavaScript 常用功能、函数、工具库，整合在 Web 项目中经常使用的JS函数和方法。

下载安装：

# 使用npm命令下载安装
$ npm i @muguilin/utils

# 使用yarn命令下载安装
yarn add @muguilin/utils

使用方法：

• 通过 JS Module(模块)方式导入使用

  <!-- ES6模块导入使用 -->
  <script type="module">
    /**
     * 1、全部引入使用
     **/
    import * as mu from "@muguilin/utils";
  
    // 在浏览器控制台中打印mu-utiljs的所有方法
    console.log(mu);
  
    // 深拷贝使用实例
    const oldObj = { key: "value" };
    const newObj = mu.deepCopy(oldObj);
  
    /**
     * 2、按需引入使用
     **/
    import { deepCopy, debounce, throttle } from "@muguilin/utils";
  
    // 深拷贝使用实例
    const oldObj = { key: "value" };
    const newObj = deepCopy(oldObj);
  </script>

• 通过 script 标签以 CDN 的形式引入使用

  <!-- 将@muguilin/utils下载后，在html文件中引入本地脚本 -->
  <script src="./js/@muguilin/utils/index.js"></script>
  <script>
    // 在浏览器控制台中打印mu-utiljs的所有方法
    console.log(mu);
    
    // 深拷贝使用实例
    const oldObj = { key: "value" };
    const newObj = mu.deepCopy(oldObj);
  </script>

支持情况：

• deepCopy() 深拷贝

  对各种数据类型、对象的进行深度拷贝！

  /**
   * @param {Object|Array} par // 拷贝的对象
   * @returns Array or Object
   */
  
  const oldObj = {x:'xxx',...} || ['x',...];
  const newObj = mu.deepCopy(oldObj); // 返回一个新的对象

• debounce() 防抖

  通过延迟执行函数来控制事件在短时间内连续触发时的执行次数，在一段时间内，无论事件触发多少次，只有最后一次会被执行。

  /**
   * @param {function} fn // 要进行防抖操作的函数
   * @param {number} delay = 300 // 间隔时间（默认300毫秒）
   * @returns function
   */
  function submitAjaxFn(){
      // 防止重复提交请求
      ...
  };
  mu.debounce(submitAjaxFn, 300);

• throttle() 节流

  通过控制在一定的时间间隔内只执行一次函数，来限制事件的触发次数，它确保在一个时间段内，事件处理函数被执行的最大频率为指定的间隔时间。

  /**
   * @param {function} fn // 要进行节流操作的函数
   * @param {number} delay = 300 // 间隔时间（默认300毫秒）
   * @returns function
   */
    
  function pageScrollFn(){
      // 限制页面滚动触发次数
      ...
  };
  mu.throttle(pageScrollFn, 500);

• getFileSuffix() 获取文件后缀名

  获取文件的后缀名！

  /**
   * @param {string} fileName // 要获取带后缀的文件名
   * @returns string
   */
    
  const suffix = mu.getFileSuffix('./upload/xxx.doc');
  console.log(suffix); // doc

• getFileUnit() 获取文件大小单位

  主要用于上传文件时（计算文件大小的单位）！

  /**
   * @param {string} fileSize // 要进行计算的文件大小
   * @returns string
   */
    
  const unit = mu.getFileUnit(65535);
  console.log(unit); // 64.00KB

• query() 获取 url 参数

  主要用于获取 url 参数 如 ?id=666&uid=888！

  /**
   * @param {string} key // 要获取url参数名
   * @returns string
   */
    
  // https://www.xxx.com/index.html?id=666
  const id = mu.query('id');
  console.log(id); // 666

• getNowDate() 获取当前日期

  获取当前日期：年、月、日

  /**
   * @name 获取当前日期
   * @description  返回当前日期：年、月、日、时、分、秒 或返回完整的 年 月 日 时 分 秒
   * @param {string:['YYYY' | 'MM' | 'DD' | hh | mm | ss] par, zh = false }
   * @returns {string}
   */
    
  mu.getNowDate(); // '2020-01-01 12:00:30'
  mu.getNowDate('', true); // '2020年01月01日 12时00分30秒'
  mu.getNowDate('YYYY'); // 2020
  mu.getNowDate('MM'); // 01
  mu.getNowDate('mm'); // 00

• uuid() 生成 uuid

  主要用于生成一个唯一的 uuid！

  /**
   * @param {string} prefix // uuid 前缀(可选参数)
   * @returns string
   */
    
  const uuid = mu.uuid();
  console.log(uuid); //'ea571ef56a774ae3890694a86be88d55'

• is() 数据类型判断

  判断是否是指定的数据类型，返回Boolean值

  /**
   * @name 数据类型判断
   * @description 判断是否是指定的数据类型
   * @param {*} any 
   * @returns Boolean
   */
  console.log('查看相关方法：', mu.is);
    
  mu.is.isArray([]) // true
  mu.is.isObject({}) // true
  mu.is.isNumber(123) // true
    
  mu.is...

• Updating 。。。！