小程序常用工具积累

• 时间格式化工具（自定义格式）

const dateFormat = (date, fmt) => {
  if (!date || !date instanceof Date) return "";
  if (!fmt || fmt.constructor != String) fmt = "yyyy-MM-dd hh:mm:ss";
  var o = {
    "M+": date.getMonth() + 1, //月份
    "d+": date.getDate(), //日
    "h+": date.getHours(), //小时
    "m+": date.getMinutes(), //分
    "s+": date.getSeconds(), //秒
    "q+": Math.floor((date.getMonth() + 3) / 3), //季度
    "S": date.getMilliseconds() //毫秒
  };
  if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (date.getFullYear() + "").substr(4 - RegExp.$1.length));
  for (var k in o)
    if (new RegExp("(" + k + ")").test(fmt))
      fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
  return fmt;
}

• 验证手机号

const mobileVerification = (mobile) => {  // mobile为手机号码
  return /^1[3-9]\d{9}$/.test(mobile)
}

• 验证身份证号

const idCardVerification = (id) => {  // id为身份证号码
  // 1 "验证通过!", 0 //校验不通过
  var format = /^(([1][1-5])|([2][1-3])|([3][1-7])|([4][1-6])|([5][0-4])|([6][1-5])|([7][1])|([8][1-2]))\d{4}(([1][9]\d{2})|([2]\d{3}))(([0][1-9])|([1][0-2]))(([0][1-9])|([1-2][0-9])|([3][0-1]))\d{3}[0-9xX]$/;
  //号码规则校验
  if (!format.test(id)) {
    return {
      'status': 0,
      'msg': '身份证号码不合规'
    };
  }
  //区位码校验
  //出生年月日校验  前正则限制起始年份为1900;
  var year = id.substr(6, 4), //身份证年
    month = id.substr(10, 2), //身份证月
    date = id.substr(12, 2), //身份证日
    time = Date.parse(month + '-' + date + '-' + year), //身份证日期时间戳date
    now_time = Date.parse(new Date()), //当前时间戳
    dates = (new Date(year, month, 0)).getDate(); //身份证当月天数
  if (time > now_time || date > dates) {
    return {
      'status': 0,
      'msg': '出生日期不合规'
    }
  }
  return {
    'status': 1,
    'msg': '校验通过'
  }
}

• 脱敏

const desensitization = (type,str) => { // type需要脱敏的类型
  let star = ''
  if(null != str && str != undefined){
  	// 姓名脱敏
    if(type=='name'){
      if(str.length <= 2){
        return str.substring(0,1)+"*"  ;
      } else {
        for (var i = 0; i < str.length-1; i++) {
          star= star + '*'
        }
        return str.substring(0,1)+ star ;
      }
     // 身份证脱敏
    }else if (type=='idCard'){
      for (var i = 0; i < str.length-7; i++) {
        star= star + '*'
      }
      return str.substring(0,3)+ star + str.substring(str.length-4,str.length);
     // 手机号脱敏
    }else if (type=='phone'){
      for (var i = 0; i < str.length-7; i++) {
        star= star + '*'
      }
      return str.substring(0,3)+ star + str.substring(str.length-4,str.length);
    }
  }
}
// 依据使用场景使用，感觉封装成工具类或者封装成组件用起来都很方便

• 函数防抖

const debounce = (fn, wait, scope) => {
  var timeout;
  return function () {
    var context = scope || this,
      args = arguments;
    var later = function () {
      timeout = null;
      fn.apply(context, args);
    };
    clearTimeout(timeout);
    timeout = setTimeout(later, wait);
  };
}

• 函数节流

const throttle = (fn, threshhold, scope) => {
  threshhold || (threshhold = 250);
  var last, deferTimer;
  return function () {
    var context = scope || this;
    var now = +new Date,
      args = arguments;
    if (now - last < threshhold) {
      // 如果时间间隔小于我们设定的时间间隔阈值，则为本次触发操作设立一个新的定时器
      clearTimeout(deferTimer);
      deferTimer = setTimeout(function () {
        last = now;
        fn.apply(context, args);
      }, threshhold);
    } else {
      // 如果时间间隔超出了我们设定的时间间隔阈值，那就不等了，无论如何要反馈给用户一次响应
      last = now;
      fn.apply(context, args);
    }
  };
}

使用举例：

// 引入组件
import {
  dateFormat，
  idCardVerification，
  mobileVerification，
  desensitization，
  debounce，
  throttle 
} from '@/utils/util'

// 在方法中使用
test(){
	dateFormat(new Date(), 'yyyy.MM.dd hh:mm:ss')
	dateFormat(new Date(), 'yyyy-MM-dd hh:mm')
	
	idCardVerification('身份证号')
	
	mobileVerification('手机号')

	desensitization('name','需要脱敏的姓名')
	desensitization('idCard','需要脱敏的身份证号')
	desensitization('phone','需要脱敏的手机号')
}；

// 防抖（在使用输入框输入、窗口大小resize之类会重复触发的事件，在多次触发同一函数时，只执行最后一次）
bindinput:debounce(function (res) {
    console.log(res) // 500ms内有输入则刷新时间，停止操作超过500ms则输出内容
}, 500，this)；

// 节流（使用在监听页面滚动、高频点击重复触发的事件，保证隔一段时间调用一次）
pageScroll:throttle(function (res) {
    console.log(res)  // 每隔500ms重复输出一次
}, 500，this)；