前端常用工具函数

前端常用工具函数

• 时间格式化

timestampToTime(timestamp) {
    var date = new Date(timestamp);//时间戳为10位需*1000，时间戳为13位的话不需乘1000
    var Y = date.getFullYear();
    var M = (date.getMonth() + 1 < 10 ? '0' + (date`在这里插入代码片`.getMonth() + 1) : date.getMonth() + 1);
    var D = date.getDate() < 10 ? '0' + date.getDate() : date.getDate();
    var H = date.getHours() < 10 ? '0' + date.getHours() : date.getHours()
    var MM = date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()
    return Y + '年' + M + '月' + D + '日' + H + ':' + MM;
  }

• 获取链接参数

getUrlParam(name) {
    const search = window.location.search;
    const matched = search
      .slice(1)
      .match(new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i'));
    return search.length ? matched && matched[2] : null;
  }

• 是否ios手机

isIos() {
    var u = navigator.userAgent;
    if (u.indexOf("iPhone") > -1 || u.indexOf("iOS") > -1) {
      return true;
    }
    return false;
  }

• 是否微信环境

getIsWxClient() {
    var ua = navigator.userAgent.toLowerCase();
    if (ua.match(/MicroMessenger/i) == "micromessenger") {
      return true;
    } else {
      return false;
    }
  }

• 是否含有汉字

checkChinese(value) {
    if (/[\u4E00-\u9FA5]/g.test(value)) {
      return true
    } else {
      return false
    }
  }

• 手机号码基础校验

isPoneAvailable: function (pone) {
    var myreg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
    if (!myreg.test(pone)) {
      return false;
    } else {
      return true;
    }
  }

• 身份证号码校验

checkIdCard(idcard) {
    var regIdCard = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/;
    if (!regIdCard.test(idcard)) {
      return false;
    } else {
      return true;
    }
  }

• 六位数字

isNum6(num) {
    var reg = new RegExp("^[0-9]{6}$");
    if (!reg.test(num)) {
      return false;
    } else {
      return true;
    }
  }

• 防抖 就是让某个时间段只执行一次

debounce(fn, delay = 200) {
    let timeout;
    return function () {
      // 重新计时
      timeout && clearTimeout(timeout);
      timeout = setTimeout(fn.bind(this), delay, ...arguments);
    }
  }

• 节流 类似控制阀门一样定期开放的函数，也就是让函数执行一次后，在某个时间段内暂时失效，过了这段时间后再重新激活（类似于技能冷却时间）

throttle(fn, delay) {
    let valid = true
    return function () {
      if (!valid) {
        //休息时间 暂不接客
        return false
      }
      // 工作时间，执行函数并且在间隔期内把状态位设为无效
      valid = false
      setTimeout(() => {
        fn()
        valid = true;
      }, delay)
    }
  }

• 浅拷贝

shallowClone(obj) {
    if (typeof obj !== 'object') {
      return;
    }
    // 根据obj的类型判断是新建一个数组还是对象
    var newObj = obj instanceof Array ? [] : {};
    for (let key in obj) {
      // 这一步做一个判定防止拷贝了原型链上的东西
      if (obj.hasOwnProperty(key)) {
        newObj[key] = obj[key];
      }
    }
    return newObj;
  }

深拷贝

deepClone = function (obj) {
    if (typeof obj !== 'object') {
      return;
    }
    var newObj = obj instanceof Array ? [] : {};
    for (var key in obj) {
      if (obj.hasOwnProperty(key)) {
        newObj[key] = typeof obj[key] === 'object' ? deepClone(obj[key]) : obj[key];
      }
    }
    return newObj;
  }

• 去重1 […new Set(arr)]

unique(arr) {
    let arrLength = arr.length;
    let new_arr = [];
    for (var i = 0; i < arrLength; i++) {
      for (var j = 0; j < new_arr.length; j++) {
        if (new_arr[j] === arr[i]) {
          break;
        }
      }
      // 这里就表示循环对比完,没有相同的
      if (j == new_arr.length) {
        new_arr.push(arr[i])
      }
    }
    return new_arr
  }

• 冒泡排序

mySort(arr) {
    let len = arr.length
    for (let i = 0; i < len; i++) {
      for (let j = 0; j < len - 1; j++) {
        if (arr[j] > arr[j + 1]) {
          let temp;
          temp = arr[j];
          arr[j] = arr[j + 1];
          arr[j + 1] = temp;
        }
      }
    }
  }

产生随机数

/**
 * 产生随机整数，包含下限值，包括上限值
 * @param {Number} lower 下限
 * @param {Number} upper 上限
 * @return {Number} 返回在下限到上限之间的一个随机整数
 */
function random(lower, upper) {
    return Math.floor(Math.random() * (upper - lower+1)) + lower;
}  
 
//console.log(random(1,100));

/**
 * 产生随机整数，包含下限值，但不包括上限值
 * @param {Number} lower 下限
 * @param {Number} upper 上限
 * @return {Number} 返回在下限到上限之间的一个随机整数
 */
function random(lower, upper) {
    return Math.floor(Math.random() * (upper - lower)) + lower;
}
 
//调用：console.log(random(1,100));

生成随机颜色

/**
 * 产生一个随机的rgb颜色
 * @return {String}  返回颜色rgb值字符串内容，如：rgb(201, 57, 96)
 */
function randomColor() {
    // 随机生成 rgb 值，每个颜色值在 0 - 255 之间
    var r = random(0, 256),
        g = random(0, 256),
        b = random(0, 256);
    // 连接字符串的结果
    var result = "rgb("+ r +","+ g +","+ b +")";
    // 返回结果
    return result;
}

获取url中的参数函数

function filterUrl() {
  var url = location.search; //获取url中"?"符后的字串
  var theRequest = new Object();
  if (url.indexOf("?") != -1) {
    var str = url.substr(1);
    strs = str.split("&");
    for (var i = 0; i < strs.length; i++) {
      theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
    }
  }
  return theRequest;
}

获取当前url中指定的hash值

//获取当前hash参数
function getHashParam(name) {
    var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)"); //构造一个含有目标参数的正则表达式对象
    var r = location.hash.substr(1).match(reg); //匹配目标参数
    if (r != null) {
        var ret = r[2];
        try {
            ret = decodeURIComponent(ret);
        } catch (e) {
            ret = unescape(ret);
        }
        return ret;
    }
    return null; //返回参数值
}

是否支持css动画

//是否支持css动画
function checkCssAnimation() {
    var styles = document.createElement('div').style;
    var animations = ['animation', 'webkitAnimation', "msAnimation", 'MozAnimation', '-moz-animation', '-webkit-animation'];
    for (var i = 0, len = animations.length; i < len; i++) {
        if (animations[i] in styles) {
            return true;
        }
    }
    return false;
}

终端验证mobile或者pc

//终端验证
function getPlatform() {
    var Agents = ["Android", "iPhone", "SymbianOS", "Windows Phone", "iPad", "iPod"];
    var flag = "pc";
    for (var v = 0, len = Agents.length; v < len; v++) {
        if (navigator.userAgent.indexOf(Agents[v]) > 0) {
            flag = "mobile";
            break;
        }
    }
    return flag;
}

是否小程序环境

//是否小程序 
function isMiniprogram() {
	 if (/(micromessenger)\/([\w\.]+)/i.test(navigator.userAgent) && /miniprogram/i.test(navigator.userAgent)) {
	   return true;
	 }
	 return false;
}

倒计时天、时、分、秒

function countDown(diff) {
  let day,
    hour,
    minute,
    second;
  // 距离的天数
  day = parseInt(diff / 1000 / 60 / 60 / 24);
  // 小时
  hour = parseInt(diff / 1000 / 60 / 60 % 24);
  // 分钟
  minute = parseInt(diff / 1000 / 60 % 60)
  // 秒
  second = parseInt(diff / 1000 % 60)
  if (day < 10) {
    day = '0' + day
  }
  if (hour < 10) {
    hour = '0' + hour
  }
  if (minute < 10) {
    minute = '0' + minute
  }
  if (second < 10) {
    second = '0' + second
  }
  if (diff < 0) {
    day = '00';
    hour = '00';
    minute = '00';
    second = '00';
  }
  return {
    day,
    hour,
    minute: minute + "",
    second: second + ""
  }
}

生成随机手机号

function getMoble() {
  let prefixArray = new Array("130", "131", "132", "133", "135", "137", "138", "170", "187", "189");
  let i = parseInt(10 * Math.random());
  let prefix = prefixArray[i];
  for (let j = 0; j < 8; j++) {
    prefix = prefix + Math.floor(Math.random() * 10);
  }
  prefix = prefix.substr(0, 3) + '*****' + prefix.substr(8)
  return prefix;
  
}

h5复制文本到剪切板

function copyContent(content) {
  let copyDom = document.createElement('div');
  copyDom.innerText=content;
  document.body.appendChild(copyDom);
  //创建选中范围
  let range = document.createRange();
  range.selectNode(copyDom);
  //移除剪切板中内容
  window.getSelection().removeAllRanges();
  //添加新的内容到剪切板
  window.getSelection().addRange(range);
  //复制
  let successful = document.execCommand('copy');
  copyDom.parentNode.removeChild(copyDom);
  try{
      let msg = successful ? content : false;
      if(msg) {
        console.log('Copy command was : ----->>>>' + msg);
      }
  } catch(err){
      console.log('Oops , unable to copy!');
  }
}

阿拉伯数字转换为简写汉字

Arabia_To_SimplifiedChinese(Num) {
        for (var i = Num.length - 1; i >= 0; i--) {
            Num = Num.replace(",", "")//替换Num中的“,”
            Num = Num.replace(" ", "")//替换Num中的空格
        }
        if (isNaN(Num)) { //验证输入的字符是否为数字
            //alert("请检查小写金额是否正确");
            return;
        }
        //字符处理完毕后开始转换，采用前后两部分分别转换
        var part = String(Num).split(".");
        var newchar = "";
        //小数点前进行转化
        for (var i = part[0].length - 1; i >= 0; i--) {
            if (part[0].length > 10) {
                //alert("位数过大，无法计算");
                return "";
            }//若数量超过拾亿单位，提示
            var tmpnewchar = ""
            var perchar = part[0].charAt(i);
            switch (perchar) {
                case "0": tmpnewchar = "零" + tmpnewchar; break;
                case "1": tmpnewchar = "一" + tmpnewchar; break;
                case "2": tmpnewchar = "二" + tmpnewchar; break;
                case "3": tmpnewchar = "三" + tmpnewchar; break;
                case "4": tmpnewchar = "四" + tmpnewchar; break;
                case "5": tmpnewchar = "五" + tmpnewchar; break;
                case "6": tmpnewchar = "六" + tmpnewchar; break;
                case "7": tmpnewchar = "七" + tmpnewchar; break;
                case "8": tmpnewchar = "八" + tmpnewchar; break;
                case "9": tmpnewchar = "九" + tmpnewchar; break;
            }
            switch (part[0].length - i - 1) {
                case 0: tmpnewchar = tmpnewchar; break;
                case 1: if (perchar != 0) tmpnewchar = tmpnewchar + "十"; break;
                case 2: if (perchar != 0) tmpnewchar = tmpnewchar + "百"; break;
                case 3: if (perchar != 0) tmpnewchar = tmpnewchar + "千"; break;
                case 4: tmpnewchar = tmpnewchar + "万"; break;
                case 5: if (perchar != 0) tmpnewchar = tmpnewchar + "十"; break;
                case 6: if (perchar != 0) tmpnewchar = tmpnewchar + "百"; break;
                case 7: if (perchar != 0) tmpnewchar = tmpnewchar + "千"; break;
                case 8: tmpnewchar = tmpnewchar + "亿"; break;
                case 9: tmpnewchar = tmpnewchar + "十"; break;
            }
            newchar = tmpnewchar + newchar;
        }
        //替换所有无用汉字，直到没有此类无用的数字为止
        while (newchar.search("零零") != -1 || newchar.search("零亿") != -1 || newchar.search("亿万") != -1 || newchar.search("零万") != -1) {
            newchar = newchar.replace("零亿", "亿");
            newchar = newchar.replace("亿万", "亿");
            newchar = newchar.replace("零万", "万");
            newchar = newchar.replace("零零", "零");
        }
        //替换以“一十”开头的，为“十”
        if (newchar.indexOf("一十") == 0) {
            newchar = newchar.substr(1);
        }
        //替换以“零”结尾的，为“”
        if (newchar.lastIndexOf("零") == newchar.length - 1) {
            newchar = newchar.substr(0, newchar.length - 1);
        }
        return newchar;
    }

保留两位小数通过截取字符串的形式，不是四舍五入

KeepTwoDecimals(obj) {
    var regDecimal = /^\d+(.\d+)?$/;
    if (regDecimal.test(obj)) {
        if (obj.toString().indexOf(".") > 0) {
            obj = obj.toString() + "00";
            obj = obj.substring(0, obj.indexOf(".") + 3);
        } else {
            obj = obj;
            // obj = obj + ".00";
        }
    }
    return Number(obj < 0 ? "0" : obj);
}

手机号码基础校验

// 手机号码基础校验
isPoneAvailable: function (pone) {
  var myreg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
  if (!myreg.test(pone)) {
      return false;
  } else {
      return true;
  }
}