js公共函数总结

字节大小转换

function byteConvert(bytes) {
  if (isNaN(bytes)) {
    return ''
  }
  var symbols = ['B', 'KB', 'MB', 'GB', 'TB', 'PB', 'EB', 'ZB', 'YB']
  var exp = Math.floor(Math.log(bytes)/Math.log(2))
  if (exp < 1) {
    exp = 0
  }
  var i = Math.floor(exp / 10)
  bytes = bytes / Math.pow(2, 10 * i)

  if (bytes.toString().length > bytes.toFixed(2).toString().length) {
    bytes = bytes.toFixed(2)
  }
  return bytes + ' ' + symbols[i]
}

Object 对象的深度克隆(深拷贝)

//实现一
function deepCopy(Obj) {
      var buf
      if (Obj instanceof Array) {
        buf = []
        var i = Obj.length
        while (i--) {
          buf[i] = deepCopy(Obj[i])
        }
        return buf
      } else if (Obj instanceof Object) {
        buf = {}
        for (var k in Obj) {
          if (Obj.hasOwnProperty(k)) {
            buf[k] = deepCopy(Obj[k])
          }
        }
        return buf
      } else {
        return Obj
      }
    }
//实现二
function deepCopy(p, c) {
  let c = c || {};
  for (var i in p) {
    if (typeof p[i] === 'object') {
      c[i] = (p[i].constructor === Array) ? [] : {};
      deepCopy(p[i], c[i]);
    } else {
      c[i] = p[i];
    }
  }
  return c;
}

时间格式化

parseTime (time, cFormat) {
  if (arguments.length === 0) {
    return null
  }
  const format = cFormat || '{y}-{m}-{d} {h}:{i}:{s}'
  let date
  if (typeof time === 'object') {
    date = time
  } else {
    if (('' + time).length === 10) time = parseInt(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(),
    l: date.getMilliseconds()
  }
  const timeStr = format.replace(/{(y|m|d|h|i|s|a|l)+}/g, (result, key) => {
    let value = formatObj[key]
    if (key === 'a') {
      return ['日', '一', '二', '三', '四', '五', '六'][value]
    }
    if (key === 'l') {
      let str = value.toString()
      if (str.length === 1) {
        str = '00' + str
      } else if (str.length === 2) {
        str = '0' + str
      }
      return str || 0
    }
    if (result.length > 0 && value < 10) {
      value = '0' + value
    }
    return value || 0
  })
  return timeStr
}

js利用空对象作为中介实现继承

function inherit(Child, Parent) {
  var F = function(){};
  F.prototype = Parent.prototype;
  Child.prototype = new F();
  Child.prototype.constructor = Child;
  Child.uber = Parent.prototype //为子对象设一个uber属性，这个属性直接指向父对象的prototype属性。（uber是一个德语词，意思是"向上"、"上一层"。）这等于在子对象上打开一条通道，可以直接调用父对象的方法。这一行放在这里，只是为了实现继承的完备性，纯属备用性质。
}

需求：get请求当参数过多时参数拼接。eg: http://www.baidu.com?a=b&name=mao

function urlConcat(url, data) {

    url += (url.indexOf('?') < 0 ? '?' : '&') + param(data)

    url = url.replace('?&', '?') // http://www.baidu.com? 避免当url最后一个字符时?号时出现'?&'的字符。eg: http://www.baidu.com?&a=b&name=mao

    return url

}

function param(data = {}) {

  let url = ''

  for (let key in data) {

    let value = data[key] !== undefined ? data[key] : ''

    url += `&${key}=${encodeURIComponent(value)}`

  }

  return url ? url.substring(1) : '' // 将拼接后第一个&字符剔除

}

解析URL参数成一个对象

function urlQueryString(url){
  debugger;
  let result = {};
  let paramStr = url.split('?')[1]
  if(!paramStr) {
    return result;
  }
  let paramArr = paramStr.split('&');
  for(let i = 0, len = paramArr.length; i < len; i++){
    let cell = paramArr[i];
    let cellArr = cell.split('=');
    let key = cellArr[0] || ''
    let value = cellArr[1] || ''
    result[key] = value
  }
  return result;
}

原生js给指定元素标签添加类

export function hasClass(el, className) {
  let reg = new RegExp(`(^|\\s)${className}(\\s|$)`)
  return reg.test(el.className)
}

export function addClass(el, className) {
  if (hasClass(el, className)) {
    return void 0
  }
  let newClass = el.className.split(' ')
  newClass.push(className)
  el.className = newClass.join(' ')
}

文件下载

function download() {
  let blob = new Blob([res.data])
  let url = window.URL.createObjectURL(blob)
  let aLink = document.createElement('a')
  aLink.download = "文件名"
  aLink.href = url
  aLink.click()
  window.URL.revokeObjectURL(url)
}

js数组去重

// 实现一
// 此方法会去除数组中的空元素
function uniqueArr(arr) {
  let result = {};
  let newArr = [];
  for(let i = 0; i < arr.length; i++){
    let temp = arr[i]
    if(!result[temp]) {
      newArr.push(temp);
      result[temp] = 1;
    }
  }
  return newArr;
}

//实现二
// 此方法会保留数组中的空元素当且仅当只有一个
function uniqueArr(arr) {
  return [...new Set(arr)]
}

//实现三
// 此方法会保留数组中的空元素当且仅当只有一个
function uniqueArr(arr) {
  return Array.from(new Set(arr))
}

//实现四
// 此方法会去除数组中的空元素
function uniqueArr(arr) {
  let result = new Map();
  return arr.filter((ele) => !result.has(ele) && result.set(ele, 1))
}

js获取istart-iend之间的随机数字eg:10-100

function getRandom(iStart, iEnd) {
  let iChoice = iEnd - iStart + 1;
  return Math.floor(Math.random() * iChoice) + iStart;
}

原生js阻止事件冒泡和事件默认行为

// 阻止事件冒泡
function stopPropagation(event) {
  if(event.stopPropagation) {
    event.stopPropagation();
  } else {
    event.cancelBubble = true;
  }
}

// 阻止事件默认行为
function preventDefault(event) {
  if(event.preventDefault) {
    event.preventDefault();
  } else {
    event.returnValue = false;
  }
}