工具函数封装

该博客围绕JavaScript展开,介绍了日期比较、从数组获取每年最大日期、校验数据类型等内容,还涉及数组过滤、对象去重、生成加密随机数、金额格式化、存储操作、文件下载、深拷贝以及本地对象模糊搜索等操作。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

日期比较  

//返回true 表示date1 > date2

//date1    date2     retutns {boolean}
export function dateompare(date1,date2){
    var d1 = new Date(date1.replace(/-/g,"/"));
    var d2 = new Date(date2.replace(/-/g,"/"));
    return d1.getTime()>d2.getTime();
}

数组中得到每年最大日期

//date   returns {Array}
export function getMaxDatesByYear(date) {
  const maxDates = {}
  for (let i = 0; i < date.length; i++) {
    const year = date[i].getFullYear();
    if (!maxDates[year] || date[i] > maxDates[year]) {
      maxDates[year] = date[i]
    }
  }
  return maxDates;
}

校验数据类型

export const typeOf = function(obj) {
  return Object.prototype.toString.call(obj).slice(8, -1).toLowerCase()
}
typeOf('vue')  // string
typeOf([])  // array
typeOf(new Date())  // date
typeOf(null) // null
typeOf(true) // boolean
typeOf(() => { }) // function

数组过滤器

//date   要去重的数组   key 根据去重的字段名  returns {Array}

export function datelist(date,key) {
  return date = date.filter(
      (obj,index) => {
         return date.findIndex((item)=> obj.key=== item.key) ===index
      }
  )
}
function datelist(date) {
            return date = date.filter(
                (obj,index) => {
                    return date.findIndex((item)=> obj.id === item.id) ===index
                }
            )
        }
        let date = [{
         id:'1',
         name:'yjm'   
        },{
         id:'2',
         name:'gg'   
        },{
         id:'3',
         name:'ss'   
        },{
         id:'1',
         name:'aaa'   
        }]
        let res = datelist(date) 
        //[{id:'1',name:'yjm'},{id:'2',name:'gg'},{id:'3',name:'ss'}]

数组对象根据字段去重

参数:
arr 要去重的数组
key 根据去重的字段名

export const uniqueArrayObject = (arr = [], key = 'id') => {
  if (arr.length === 0) return
  let list = []
  const map = {}
  arr.forEach((item) => {
    if (!map[item[key]]) {
      map[item[key]] = item
    }
  })
  list = Object.values(map)

  return list
}
const responseList = [
    { id: 1, name: 'vue' },
    { id: 2, name: 'react' },
    { id: 3, name: 'angular' },
    { id: 1, name: 'vue' },
    { id: 2, name: 'react' },
    { id: 3, name: 'angular' },
    { id: 1, name: 'vue' },
    { id: 2, name: 'react' },
    { id: 3, name: 'angular' },
]

uniqueArrayObject(responseList, 'id')
// [{ id: 1, name: 'vue' },{ id: 2, name: 'react' },{ id: 3, name: 'angular' }]

加密码随机数

export const numId = () => {
  const temp_url = URL.createObjectURL(new Blob())
  const numId = temp_url.toString()
  URL.revokeObjectURL(temp_url) //释放这个url
  return numId.substring(numId.lastIndexOf('/') + 1)
}
numId() // 5795c038-f7d1-428f-bdc7-ba532f768c3c

金额格式化

/**
             * number 要格式化的数字  //number
             * decimalnum 保留几位小数  //number
             * decimal_symbol 小数点符号   //string
             * thousands_symbol 千分位符号  //string
            */
            export const moneyNumber = (number, decimalnum, decimal_symbol, thousands_symbol) => {
            number = (number + '').replace(/[^0-9+-Ee.]/g, '')
            const n = !isFinite(+number) ? 0 : +number
            const prec = !isFinite(+decimalnum) ? 2 : Math.abs(decimalnum)
            const sep = typeof thousands_symbol === 'undefined' ? ',' : thousands_symbol
            const dec = typeof decimal_symbol === 'undefined' ? '.' : decimal_symbol
            let s = ''
            const toFixedFix = function(n, prec) {
                const k = Math.pow(10, prec)
                return '' + Math.ceil(n * k) / k
            }
            s = (prec ? toFixedFix(n, prec) : '' + Math.round(n)).split('.')
            const re = /(-?\d+)(\d{3})/
            while (re.test(s[0])) {
                s[0] = s[0].replace(re, '$1' + sep + '$2')
            }

            if ((s[1] || '').length < prec) {
                s[1] = s[1] || ''
                s[1] += new Array(prec - s[1].length + 1).join('0')
            }
            return s.join(dec)
            }

moneyNumber(2000000) // 20,000,000.0
moneyNumber(20000000, 3, '.', '-') // 20-000-000.00

存储操作

class MyCache {
  constructor(isLocal = true) {
    this.storage = isLocal ? localStorage : sessionStorage
  }

  setItem(key, value) {
    if (typeof (value) === 'object') value = JSON.stringify(value)
    this.storage.setItem(key, value)
  }

  getItem(key) {
    try {
      return JSON.parse(this.storage.getItem(key))
    } catch (err) {
      return this.storage.getItem(key)
    }
  }

  removeItem(key) {
    this.storage.removeItem(key)
  }

  clear() {
    this.storage.clear()
  }

  key(index) {
    return this.storage.key(index)
  }

  length() {
    return this.storage.length
  }
}

const localCache = new MyCache()
const sessionCache = new MyCache(false)

export { localCache, sessionCache }
localCache.getItem('user')
sessionCache.setItem('name','树哥')
sessionCache.getItem('token')
localCache.clear()
sessionCache.clear()

下载文件

/**参数:
api 接口
params 请求参数
fileName 文件名 **/

const downloadFile = (api, params, fileName, type = 'get') => {
  axios({
    method: type,
    url: api,
    responseType: 'blob', 
    params: params
  }).then((res) => {
    let str = res.headers['content-disposition']
    if (!res || !str) {
      return
    }
    let suffix = ''
    // 截取文件名和文件类型
    if (str.lastIndexOf('.')) {
      fileName ? '' : fileName = decodeURI(str.substring(str.indexOf('=') + 1, str.lastIndexOf('.')))
      suffix = str.substring(str.lastIndexOf('.'), str.length)
    }
    //  如果支持微软的文件下载方式(ie10+浏览器)
    if (window.navigator.msSaveBlob) {
      try {
        const blobObject = new Blob([res.data]);
        window.navigator.msSaveBlob(blobObject, fileName + suffix);
      } catch (e) {
        console.log(e);
      }
    } else {
      //  其他浏览器
      let url = window.URL.createObjectURL(res.data)
      let link = document.createElement('a')
      link.style.display = 'none'
      link.href = url
      link.setAttribute('download', fileName + suffix)
      document.body.appendChild(link)
      link.click()
      document.body.removeChild(link)
      window.URL.revokeObjectURL(link.href);
    }
  }).catch((err) => {
    console.log(err.message);
  })
}
downloadFile('/api/download', {id}, '文件名')

深拷贝

export const clone = parent => {
  // 判断类型
  const isType = (obj, type) => {
    if (typeof obj !== "object") return false;
    const typeString = Object.prototype.toString.call(obj);
    let flag;
    switch (type) {
      case "Array":
        flag = typeString === "[object Array]";
        break;
      case "Date":
        flag = typeString === "[object Date]";
        break;
      case "RegExp":
        flag = typeString === "[object RegExp]";
        break;
      default:
        flag = false;
    }
    return flag;
  };

  // 处理正则
  const getRegExp = re => {
    var flags = "";
    if (re.global) flags += "g";
    if (re.ignoreCase) flags += "i";
    if (re.multiline) flags += "m";
    return flags;
  };
  // 维护两个储存循环引用的数组
  const parents = [];
  const children = [];

  const _clone = parent => {
    if (parent === null) return null;
    if (typeof parent !== "object") return parent;

    let child, proto;

    if (isType(parent, "Array")) {
      // 对数组做特殊处理
      child = [];
    } else if (isType(parent, "RegExp")) {
      // 对正则对象做特殊处理
      child = new RegExp(parent.source, getRegExp(parent));
      if (parent.lastIndex) child.lastIndex = parent.lastIndex;
    } else if (isType(parent, "Date")) {
      // 对Date对象做特殊处理
      child = new Date(parent.getTime());
    } else {
      // 处理对象原型
      proto = Object.getPrototypeOf(parent);
      // 利用Object.create切断原型链
      child = Object.create(proto);
    }

    // 处理循环引用
    const index = parents.indexOf(parent);

    if (index != -1) {
      // 如果父数组存在本对象,说明之前已经被引用过,直接返回此对象
      return children[index];
    }
    parents.push(parent);
    children.push(child);

    for (let i in parent) {
      // 递归
      child[i] = _clone(parent[i]);
    }

    return child;
  };
  return _clone(parent);
};
// 此方法存在一定局限性:一些特殊情况没有处理: 例如Buffer对象、Promise、Set、Map。
// 如果确实想要完备的深拷贝,推荐使用 lodash 中的 cloneDeep 方法。

模糊搜索(本地对象根据字段搜索)

/**
 * list 数组
 * key 查询关键词
 * keyName 查询属性
*/
export const listQuery = (list, key, keyName = 'name') => {
const reg = new RegExp(key)
const arr = []
for (let i = 0; i < list.length; i++) {
    if (reg.test(list[i][keyName])) {
    arr.push(list[i])
    }
}
return arr
}
const list = [
{ id: 1, name: '爸爸' },
{ id: 2, name: '妈妈' },
{ id: 3, name: '弟弟' },
{ id: 4, name: '妹妹' },
{ id: 5, name: '姐姐' },
{ id: 6, name: '哥哥' },
]
listQuery(list, '妹', 'name') // [{id: 4, name: '妹妹'}]

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值