js常用公共函数总结,建议收藏(持续更新)

Public:

提示:记录一些常用的js类型判断:

  1. 判断是否某个值是否为对象
// 1.使用 typeof 运算符:
typeof yourValue === 'object' && yourValue !== null
// 2.使用 instanceof 运算符:
yourValue instanceof Object
// 3.使用 Object.prototype.toString.call() 方法:
Object.prototype.toString.call(yourValue) === '[object Object]'
  1. 判断某个值是否为数组
// 1.使用 Array.isArray() 方法来判断一个值是否为数组 为true则是数组 ,反之亦然.
Array.isArray(value)  
//2.Object.prototype.toString.call() 方法:
Object.prototype.toString.call(value) === '[object Array]'

提示:记录一些常用的公共方法:

  1. 将字典转换为数组对象 ( 若为空对象则返回空数组)
/**
 1.  {成绩: 99}  --->  [{key:'成绩', value:'99'}]
 */
function dictToArray(obj: any) {
  if (obj && Object.keys(obj).length !== 0) {
    return Object.entries(obj).map(([key, value]) => ({ key, value }));
  } else {
    return [];
  }
}
  1. 判断值是否为json类型 (若为json类型则返回true ,反之为false)
/**
 1. 	判断值是否为json类型
 */
function isJson(str: string | object) {
  if (typeof str === 'string') {
    try {
      var obj = JSON.parse(str);
      if (typeof obj === 'object' && obj) {
        return true;
      } else {
        return false;
      }
    } catch (e) {
      console.log('error', e);
      return false;
    }
  }
}
  1. 获取url-search参数(需要使用 @vueuse/core中的方法)
/**
 1. 获取url-search参数(history)
 2.  需要使用 @vueuse/core 中的useUrlSearchParams和getUrlHashParams方法
 3. @param key URL参数key,不传时返回所有参数集合
 */
import { useUrlSearchParams } from '@vueuse/core';
function getUrlParams<T = any>(key?: string): T {
  const params = useUrlSearchParams('history', {
    write: false,
  });
  if (key === undefined) return params as any;
  const ret = params[key];
  if (!ret) return getUrlHashParams(key);
  return ret as T;
}
  1. 打开外部链接 (传入url调用方法即可)
/**
 1. @description 打开外部链接
 2. @param {string} path
 3. @returns {void}
 */
function openLink(path: string): void {
  window?.open(path);
}
  1. 判断字符串中是否存在html格式代码 ( 使用场景 : 一般在判断是否需要使用v-html的时候 )
// 判断字符串中是否存在html格式代码
  htmlCase: response => {
    const htmlPattern = /(<([^>]+)>)/gi;
    if (htmlPattern.test(response)) {
       console.log(response,'该响应包含HTML标记');
      return true;
    } else {
      console.log(response,'该响应不包含HTML标记');
      return false;
    }
  },
  1. 函数防抖,用于将多次执行变为最后一次执行 ( 多次使用回城,不会叠加只会执行一次)
/**
 1. @desc  函数防抖,用于将多次执行变为最后一次执行
 2. @param {function} func - 需要使用函数防抖的被执行的函数。必传
 3. @param {Number} wait - 多少毫秒之内触发,只执行第一次,默认1000ms。可以不传
 */
export function debounce(fn, delay) {
  delay = delay || 1000; //默认1s后执行
  let timer = null;
  return function () {
    let context = this;
    let arg = arguments;
    if (timer) {
      clearTimeout(timer);
    }
    timer = setTimeout(() => {
      fn.apply(context, arg);
    }, delay);
  };
}
  1. 节流函数, 用于将多次执行变为每隔一段时间执行(技能需要CD ,CD时间内无法再次使用该技能)
/**
 * 节流函数, 用于将多次执行变为每隔一段时间执行
 * @param fn 事件触发的操作
 * @param delay 间隔多少毫秒需要触发一次事件
 */
export function throttle2(fn, delay) {
  let timer = null;
  return function () {
    let context = this;
    let args = arguments;
    if (!timer) {
      timer = setTimeout(function () {
        fn.apply(context, args);
        clearTimeout(timer);
      }, delay);
    }
  };
}
  1. 格式化时间

/**
 * 格式化时间为年月日时分秒的格式, 格式可以自定义。 
 * ① 时间戳10位和13位都可以转换成格式化的日期
 * ② java8格式的日期和有效的日期都可以转换成定义的日期格式
 * @param {Date, string}  都有默认参数
 * @example 
 * parseTime() // 2020-07-17 09:53:07
 * parseTime('2018-02-13T06:17') // 2018-02-13 06:17:00
 * parseTime('2020/03/02 06:02') // 2020-03-02 06:02:00
 * parseTime(1541927611000); //2018-11-11 17:13:21
 * parseTime(1541927611000, "{y}年{m}月{d}日 {h}时{m}分{s}秒"); // 2018年11月11日 17时11分31秒
 * parseTime(1541927611, "{y}/{m}/{d} {h}:{m}:{s}"); // 2018/11/11 17:11:31   
 * parseTime(new Date()); //2018-11-11 17:13:21
 * parseTime(new Date().getTime()); //2018-11-11 17:13:21 
 */
export function parseTime(time = new Date(), cFormat = "{y}-{m}-{d} {h}:{i}:{s}") {
    let date;
    if (typeof time === "object") {
        date = time;
    } else {
        if (("" + time).length === 10) time = parseInt(time) * 1000;
        date = new Date(time);
    }
    const formatObj = {
        y: date.getFullYear(),
        m: date.getMonth() + 1,
        d: date.getDate(),
        h: date.getHours(),
        i: date.getMinutes(),
        s: date.getSeconds(),
        a: date.getDay()
    };
    const time_str = cFormat.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
        let value = formatObj[key]; // Note: getDay() returns 0 on Sunday
        if (key === "a") {
            return ["日", "一", "二", "三", "四", "五", "六"][value];
        }
        if (result.length > 0 && value < 10) {
            value = "0" + value;
        }
        return value || 0;
    });
    console.log(time_str);
    return time_str;
}


  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值