工作常用JS工具库

Array

从数组中删除重复的项

const removeDuplicatedValues = array => […new Set(array)];
let arr = removeDuplicatedValues([5, 3, 2, 5, 6, 1, 1, 6]); // [5, 3, 2, 6, 1]

检查所有项是否相等

const areAllEqual = array => array.every(item => item === array[0]);
let check1 = areAllEqual([3, 5, 2]); // false
let check2 = allEqual([3, 3, 3]); // true

数组对象去重

function unique(arr,u_key) {
  let map = new Map()
  arr.forEach((item,index)=>{
    if (!map.has(item[u_key])){
      map.set(item[u_key],item)
    }
  })
  return [...map.values()]
}

按照精度截取数据(一)

/**
 * @description: 按照精度截取数据(小数,科学记数法,非四舍五入)
 * @param {*}
 * @return {*} string
 */
export function truncateData(value, decimals) {
  let amount = String(value);
  let isDealPosint = amount.split(".");
  if (!isDealPosint && value * 1 < 0 && isDealPosint.length < 2) {
    amount = _toNonExponential(value * 1);
    isDealPosint = amount.split(".");
  }
  if (isDealPosint && isDealPosint.length === 2) {
    let integer = isDealPosint[0];
    let point = isDealPosint[1];
    let maxLength = decimals * 1 + integer.length + 1;
    if (point && point.length) return amount.substring(0, maxLength);
  }
  return amount;
}


/**
 * @description: 将科学记数法转化正常计数
 * @param {*} num
 * @return {*}
 */
function _toNonExponential(num) {
  var m = num.toExponential().match(/\d(?:\.(\d*))?e([+-]\d+)/);
  return num.toFixed(Math.max(0, (m[1] || "").length - m[2]));
}

按照精度截取数据(二)

/**
 * @description: 处理合约中数据精度问题
 * @param{*}amount
 * @param{*}decimals
 * @return{*}
 */
 export function dealDecimals(amount, decimals) {
  if (!amount) return 0
  let index = amount.length - decimals;
  if (index < 1) return _.divide(amount, 10 ** decimals)
  amount = String(amount);
  const array = [amount.substr(0, index), amount.substr(index, decimals)];
  let result = array.join(".");
  return  result;
}

String

获取选中内容

const getSelectedText = () => window.getSelection().toString();

生成16进制的随机颜色

const randomHexColor = () => `#${Math.floor(Math.random() * 0xffffff).toString(16).padEnd(6, "0")}`
console.log(randomHexColor());

指定长度的数字随机数

/*
* @method  返回随机数据戳
* @param {len = 8} :number 输入的字符串
* callback:string
*/
export function createNumberStamp(len = 8) {
  let target = 2 + len * 1
  return Math.random().toString().slice(2, target)
  //或者
 	return String(Math.random()).slice(2, target)
}

指定范围的随机打印

Math.floor(Math.random()*16)

获取时间戳(毫秒)

• new Date().getTime()
• Date.now()
• Date.parse(newDate()) – 整秒数

function getTimeStamp() {
   return Date.parse(newDate()) /1000;
}

随机字符串(数字加字母)

 function createRandomStr(len = 6) {
      var rdmString = "";
      for (
        ;
        rdmString.length < len;
        rdmString += Math.random()
          .toString(36)
          .substr(2)
      );
      return rdmString.substr(0, len);
    }

解析URL携带参数

function parseQuery(val) {
  var params = {},
    seg = val.replace(/^\?/, '').split('&'),
    len = seg.length,
    p;
  for (var i = 0; i < len; i++) {
    if (seg[i]) {
      p = seg[i].split('=');
      params[p[0]] = p[1];
    }
  }
  return params;
}

复制到粘贴板

function copyHandle(address) {
  let copy = (e) => {
    e.preventDefault();
    e.clipboardData.setData("text/plain", address);
    message.success("copy successfully");
    document.removeEventListener("copy", copy);
  };
  document.addEventListener("copy", copy);
  document.execCommand("Copy");
}

在字符串中查找给定的单词，并替换为另一个单词

const findAndReplace = (string, wordToFind, wordToReplace) => string.split(wordToFind).join(wordToReplace);

let result = findAndReplace(‘I like banana’, ‘banana’, ‘apple’); // I like apple

判断类型(全部小写)

typeOf方法

typeof 可以返回的类型为：number、string、boolean、undefined、object、function

• （1）undefined：是所有没有赋值变量的默认值，自动赋值。
• （2）null：主动释放一个变量引用的对象，表示一个变量不再指向任何对象地址。

prototype.toString.call方法

• number
• string
• boolean
• array
• object
• regexp
• function
• date

/**
 * @description: judgeType
 * @param {*} target
 * @return {number, string, boolean, array, function,object, regexp, date}
 */
function _judgeTypes (target) {
  return Object.prototype.toString.call(target).replace(/^\[object\s(\w+)\]$/, '$1').toLowerCase()
 //return Reflect.apply(Object.prototype.toString, target, []).replace(/^\[object\s(\w+)\]$/, '$1').toLowerCase()
 }

文本数据脱敏

/**
 * @description: 长文本省略中间部分
 * @param {string} str 文本内容
 * @param {number} start 保留文本头部长度
 * @param {number} end 保留文本尾部长度
 * @return {string}
 */
 export function ellipsisStr(str, start = 6, end = 4) {
  if (typeof str === "string") {
    return str.slice(0, start) + "..." + str.slice(-end);
  }
  return str;
}

Number

匹配并且筛选出数字

//1
let size = '152270110KB'
let matchArr = size.match(/\d+/g) 
console.log(matchArr) ["152270110"]
// 2
let size = '152270110KB'
size.match(/(\d+)[KB]/gi)
console.log(RegExp.$1) "152270110"

截取金额数据(非四舍五入)

/**
 * @description: 截取金额数据(非四舍五入)
 * @param {*} number
 * @param {*} length
 * @return {*}
 */
 export function toFixed(number, length = 2) {
  return Math.floor(Math.pow(10, length) * number) / Math.pow(10, length);
}

将科学记数法转化正常计数

/**
 * @description: 将科学记数法转化正常计数
 * @param {*} num
 * @return {*}
 */
 function _toNonExponential(num) {
  var m = num.toExponential().match(/\d(?:\.(\d*))?e([+-]\d+)/);
  return num.toFixed(Math.max(0, (m[1] || "").length - m[2]));
}

算法取整

Math.round(x) 四舍五入
Number.prototype.toFixed 四舍五入
Math.floor(x) 向下舍入
Math.ceil(x) 向上舍入
parseInt(7/2) 保留整数部分

弧度换角度

const radianToDegree = radian => (radian * 180.0) / Math.PI;
let degree = radianToDegree(2.3); // 131.78

环境

打开浏览器(防止拦截)

/**
 * @description: open other URL (防拦截)
 * @param {*} url
 * @param {*} id
 * @return {*}
 */
export function openUrl(url, id = "default") {
  var a = document.createElement("a");
  a.setAttribute("href", url);
  a.setAttribute("target", "_blank");
  a.setAttribute("id", id);
  // 防止反复添加
  if (!document.getElementById(id)) {
    document.body.appendChild(a);
  }
  a.click();
}

回到页面顶部

const scrollToTop = () => {
  const t = document.documentElement.scrollTop || document.body.scrollTop;
  if (t > 0) {
    window.requestAnimationFrame(scrollToTop);
    window.scrollTo(0, t — t / 8);
  }
};

判断是否为苹果系统

export const isAppleMobileDevice = () => {
  let reg = /iphone|ipod|ipad|Macintosh/i;
  return reg.test(navigator.userAgent.toLowerCase());
}

判断微信环境

export function is_wechat () {
  var ua = navigator.userAgent.toLowerCase()
  return ua.match(/MicroMessenger/i) == 'micromessenger';
}

JSAPI微信内支付（ios，安卓支付正常）

export function jsSDK (params) {
  if (typeof window.WeixinJSBridge === 'undefined') {
    if (document.addEventListener) {
      document.addEventListener('WeixinJSBridgeReady', function () { onBridgeReady(params) }, false)
    } else if (document.attachEvent) {
      document.attachEvent('WeixinJSBridgeReady', function () { onBridgeReady(params) })
      document.attachEvent('onWeixinJSBridgeReady', function () { onBridgeReady(params) })
    }
  } else {
    onBridgeReady(params)
  }
}

function onBridgeReady (params) {
  window.WeixinJSBridge.invoke(
    'getBrandWCPayRequest', {
      'appId': params.appId, // 公众号名称，由商户传入
      'timeStamp': params.timeStamp, // 时间戳，自1970年以来的秒数
      'nonceStr': params.nonceStr, // 随机串
      'package': params.package,
      'signType': params.signType, // 微信签名方式：
      'paySign': params.paySign // 微信签名
    },
    function (res) {
      if (res.err_msg === 'get_brand_wcpay_request:ok') {
        // 使用以上方式判断前端返回,微信团队郑重提示：
        // res.err_msg将在用户支付成功后返回ok，但并不保证它绝对可靠。
        location.href = 'https://test.develop.privhub.com/pay/success'
      } else {
        location.href = 'https://test.develop.privhub.com/pay/fail'
      }
    }
  )
}

分享到此结束，可能还可以优化，维护更少的变量，目前没有好主意，如果有新的想法的伙伴请email到webkubor@163.com