常用js函数封装

1、函数防抖

/*函数节流 降低触发频率*/

function throttle(fn, interval) {

  var enterTime = 0; //触发的时间

  var gapTime = interval || 1000; //间隔时间，如果interval不传，则默认1000ms

  return function () {

    var context = this;

    var backTime = new Date(); //第一次函数return即触发的时间

    if (backTime - enterTime > gapTime) {

      fn.call(context, arguments[0]);

      enterTime = backTime; //赋值给第一次触发的时间，这样就保存了第二次触发的时间

    }

  };

}

2、函数节流 

/*函数防抖 一定时间内只会在最后一次触发*/

function debounce(fn, interval) {

  var timer;

  var gapTime = interval || 1000; //间隔时间，如果interval不传，则默认1000ms

  return function () {

    clearTimeout(timer);

    var context = this;

    var args = arguments[0]; //保存此处的arguments，因为setTimeout是全局的，arguments不是防抖函数需要的。

    timer = setTimeout(function () {

      fn.call(context, args);

    }, gapTime);

  };

}

3、数组去重

/*数组去重  可将filter更换为forEach*/

function uniqueFun(oldArr) {

  var newArr = []

  newArr = oldArr.filter((item) => {

    return newArr.includes(item) ? '' : newArr.push(item)

  })

  return newArr

}

4、禁止键盘事件

//禁止键盘事件

function onkeydownFun() {

  document.onkeydown = function (e) {

    var evt = window.event || e;

    var code = evt.keyCode || evt.which;

    //屏弊空格键,上下左右键，tab键，回车键，f11-f12

    if ([32, 8, 37, 38, 39, 40, 9, 13, 27].includes(code) || (code > 111 && code < 124)) {

      if (evt.preventDefault) {

        evt.preventDefault();

      } else {

        evt.keyCode = 0;

        evt.returnValue = false;

      }

    }

  };

  //禁止鼠标右键菜单

  document.oncontextmenu = function (e) {

    return false;

  };

  //阻止后退的所有动作，包括 键盘、鼠标手势等产生的后退动作。

  history.pushState(null, null, window.location.href);

  window.addEventListener("popstate", function () {

    history.pushState(null, null, window.location.href);

  });

}

 5、导出表格

//导出表格

function exportDataToExcel(res, title, num = "note") {

  const blob = new Blob([res]); // 接受文档流

  const a = document.createElement("a");

  const url = window.URL.createObjectURL(blob);

  let time = dateFormat(new Date())

  // const filename = title + time + ".xlsx";

  const filename = num === 'note' ? `${title}${time}.xlsx` : `${title}.xlsx` //表格名称

  a.href = url;

  a.download = filename;

  document.body.appendChild(a);

  a.click();

  window.URL.revokeObjectURL(url);

  document.body.removeChild(a);

}

 6、时间处理相关

6.1.将系统时间转换为  yyyyMMddHHmmss

//处理当前时间为 20230102120000

function dateFormat(time) {

  let date = new Date(time)

  let year = date.getFullYear()

  /* 在日期格式中，月份是从0开始的，因此要加0

   * 使用三元表达式在小于10的前面加0，以达到格式统一  如 09:11:05

   * */

  let month = date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1

  let day = date.getDate() < 10 ? '0' + date.getDate() : date.getDate()

  let hours = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()

  let minutes = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()

  let seconds = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds()

  // 拼接

  return (

    year.toString() + month.toString() + day.toString() + hours.toString() + minutes.toString() + seconds.toString()

  )

}

 6.2.将系统时间转换为 yyyy-MM-dd

// 获取当前年月日 2023/03/28
function dateFun() {
  const nowDate = new Date();
  const date = {
    year: nowDate.getFullYear(),
    month: nowDate.getMonth() + 1,
    date: nowDate.getDate(),
  };
  const newmonth = date.month > 10 ? date.month : "0" + date.month;
  const newday = date.date > 10 ? date.date : "0" + date.date;
  return date.year + "-" + newmonth + "-" + newday;
}

6.3.日期格式化

// 日期格式化
export function parseTime(time, pattern) {
  if (arguments.length === 0 || !time) {
    return null
  }
  const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
  let date
  if (typeof time === 'object') {
    date = time
  } else {
    if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
      time = parseInt(time)
    } else if (typeof time === 'string') {
      time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
    }
    if ((typeof time === 'number') && (time.toString().length === 10)) {
      time = 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 = format.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
  })
  return time_str
}

export default {

  throttle,
  debounce,
  uniqueFun,
  onkeydownFun,
  dateFun

}