js之function

颜色转换:hex转rgba

hex2Rgba(bgColor, alpha = 1) {
  const color = bgColor.slice(1) // 去掉'#'号
  const rgba = [
	parseInt('0x' + color.slice(0, 2)),
	parseInt('0x' + color.slice(2, 4)),
	parseInt('0x' + color.slice(4, 6)),
	alpha,
  ]
  return 'rgba(' + rgba.toString() + ')'
}

深度扁平化阵列(多维数组展开)

deepFlat(array) {
  return [].concat(...array.map(value => (Array.isArray(value) ? this.deepFlat(value) : value)))
}

一维数组划分等长二维数组

group(array, subGroupLength) {
  let index = 0
  let newArray = []
  while (index < array.length) {
     newArray.push(array.slice(index, (index += subGroupLength)))
  }
  return newArray
}

jwt解析

const jwtStr = getCookie('Authorization-Idaas')
const data = decodeURIComponent(escape(window.atob(jwtStr.split('.')[1].replace(/-/g, '+').replace(/_/g, '/'))))
const jsonData = JSON.parse(data)

解析get参数

const params = {}
location.search.replace(/([^?&=]+)=([^&]+)/g,(_,k,v)=>params[k]=v)
console.log(params)

数值千分位展示

toThousands(data) {
  const num = parseFloat(Number(data).toFixed(3))
  let [integer, decimal] = String.prototype.split.call(num, '.')  // 整数、小数
  integer = integer.replace(/\d(?=(\d{3})+$)/g, '$&,')  // 正则先行断言
  return num ? `${integer}${decimal ? '.' + decimal : ''}` : data  // 数值类型放回千分位,否则返回原数
}

数值向上取整十、整百、整千…

formatRoundNum(num) {
  const integer = Math.ceil(num)
  const length = String(integer).length
  return Math.ceil(integer / Math.pow(10, length - 1)) * Math.pow(10, length - 1)
}

复制纯文本

 copy(text) {
   var textarea = document.createElement("textarea")
   document.body.appendChild(textarea)
   textarea.value = text
   textarea.select()
   document.execCommand("Copy")
   document.body.removeChild(textarea)
   this.$message.success('复制成功')
}

动态修改网站图标

    const changeFavicon = link => {
      let $favicon = document.querySelector('link[rel="icon"]')
      if ($favicon !== null) {
        $favicon.href = link
      } else {
        $favicon = document.createElement('link')
        $favicon.rel = 'icon'
        $favicon.href = link
        document.head.appendChild($favicon)
      }
    }
    const url = require('@/assets/img/logo-icon.png') // 图片url示例
    changeFavicon(url)

十六进制转十进制

function hex2int(hexStr) {
  let twoStr = parseInt(hexStr,16).toString(2); // 将十六转十进制,再转2进制
  let bitNum = hexStr.length * 4; // 1个字节 = 8bit ,0xff 一个 "f"就是4位
  if(twoStr.length < bitNum){
    while(twoStr.length < bitNum){
      twoStr = "0" + twoStr;
    }
  }
  if(twoStr.substring(0,1) == "0"){
    // 正数
    twoStr = parseInt(twoStr,2); // 二进制转十进制
    return twoStr;
  }else{
    // 负数
    let twoStr_unsign = "";
    twoStr = parseInt(twoStr,2) - 1; // 补码:(负数)反码+1,符号位不变;相对十进制来说也是 +1,但这里是负数,+1就是绝对值数据-1
    twoStr = twoStr.toString(2);
    twoStr_unsign = twoStr.substring(1,bitNum); // 舍弃首位(符号位)
    // 去除首字符,将0转为1,将1转为0   反码
    twoStr_unsign = twoStr_unsign.replace(/0/g, "z");
    twoStr_unsign = twoStr_unsign.replace(/1/g, "0");
    twoStr_unsign = twoStr_unsign.replace(/z/g, "1");
    twoStr = parseInt(-twoStr_unsign, 2);
    return twoStr;
  }
}

切换全屏状态

    fullScreen() {
      const document = window.document
      if (!!document.fullscreenElement || !!document.webkitFullscreenElement) {
        // 退出全屏
        if (document.exitFullscreen) {
          document.exitFullscreen()
        } else if (document.msExitFullscreen) {
          document.msExitFullscreen()
        } else if (document.mozCancelFullScreen) {
          document.mozCancelFullScreen()
        } else if (document.webkitExitFullscreen) {
          document.webkitExitFullscreen()
        } else if (document.webkitCancelFullscreen) {
          document.webkitCancelFullscreen()
        }
      } else {
        // 进入全屏
        if (!document.fullscreenElement && !document.mozFullScreenElement && !document.webkitFullscreenElement && !document.msFullscreenElement) {
          if (document.documentElement.requestFullscreen) {
            document.documentElement.requestFullscreen()
          } else if (document.documentElement.msRequestFullscreen) {
            document.documentElement.msRequestFullscreen()
          } else if (document.documentElement.mozRequestFullScreen) {
            document.documentElement.mozRequestFullScreen()
          } else if (document.documentElement.webkitRequestFullscreen) {
            document.documentElement.webkitRequestFullscreen()
          }
        }
      }
    }

格式化时间戳,时间戳获取日期、星期、时间

/**
 * 格式化时间戳
 * @param {*} time 时间戳:1653381151
 * @returns 格式化日期时间:2022-05-24 16:31:12
 */
formatTimestamp(time) {
  let date = new Date(time);
  let year = date.getFullYear();
  let month = date.getMonth() + 1;
  month = month < 10 ? ('0' + month) : month;
  let day = date.getDate();
  day = day < 10 ? ('0' + day) : day;
  let h = date.getHours();
  h = h < 10 ? ('0' + h) : h;
  let m = date.getMinutes();
  m = m < 10 ? ('0' + m) : m;
  let s = date.getSeconds();
  s = s < 10 ? ('0' + s) : s;
  return year + "-" + month + "-" + day + " " + h + ":" + m + ":" + s;
}
   /**
     * 获取日期、星期、时间
     * @param {*} value 时间戳
     */
    getDateTime(value = new Date()) {
      const data = {
        date: new Date(value).getFullYear() + '/' + (new Date(value).getMonth() + 1) + '/' + new Date(value).getDate(),
        timeStamp: dayjs(value).unix() * 1000, 
      }
      let date = new Date(data.timeStamp)
      const weekList = ['星期日', '星期一', '星期二', '星期三', '星期四', '星期五', '星期六']
      let w = date.getDay()
      let h = date.getHours()
      let m = date.getMinutes()
      let s = date.getSeconds()
      this.date = data.date  // 日期
      this.week = weekList[w]  // 星期
      this.time = `${h}:${m < 10 ? '0' + m : m}:${s < 10 ? '0' + s : s}`   // 时间
      // 实时更新
      setInterval(() => {
        data.timeStamp += 1000
        date = new Date(data.timeStamp)
        w = date.getDay()
        h = date.getHours()
        m = date.getMinutes()
        s = date.getSeconds()
        this.date = data.date
        this.week = weekList[w]
        this.time = `${h}:${m < 10 ? '0' + m : m}:${s < 10 ? '0' + s : s}`
      }, 1000)
    }
   /**
     * 秒 转化为 时分秒
     * @param {*} time 秒
     */
    getTime(time) {
      let h = parseInt(time / 60 / 60 % 24)
      // h = h < 10 ? '0' + h : h
      let m = parseInt(time / 60 % 60)
      // m = m < 10 ? '0' + m : m
      let s = parseInt(time % 60)
      // s = s < 10 ? '0' + s : s
      return [h, m, s]
    }

设置、获取、删除、清空cookie

/**
 * 获取cookie
 * @param {*} key 键
 * @returns 值
 */
getCookie(key) {
  if (document.cookie.length > 0) {
    var start = document.cookie.indexOf(key + '=')
    if (start !== -1) {
      start = start + key.length + 1
      var end = document.cookie.indexOf(';', start)
      if (end === -1) end = document.cookie.length
      return unescape(document.cookie.substring(start, end))
    }
  }
  return ''
}

/**
 * 设置cookie
 * @param {*} key 键
 */
setCookie(cName, value, expiredays) {
  var exdate = new Date()
  exdate.setDate(exdate.getDate() + expiredays)
  document.cookie = cName + '=' + decodeURIComponent(value) + (expiredays == null ? '' : ';expires=' + exdate.toGMTString())
}

/**
 * 删除cookie
 * @param {*} key 键
 */
delCookie(name) {
  var exp = new Date()
  exp.setTime(exp.getTime() - 1)
  var cval = getCookie(name)
  // 重要:path=/表示删除当前域名的cookie,不加可能导致找不到而删除失败
  if (cval != null) document.cookie = name + '=' + cval + ';expires=' + exp.toGMTString() + '; path=/' 
}

/**
 * 清空cookie
 */
clearCookie() {
  var keys = document.cookie.match(/[^ =;]+(?=\=)/g)
  if (keys) {
    for (var i = keys.length; i--; ) {
      document.cookie = keys[i] + '=0;path=/;expires=' + new Date(0).toUTCString() //清除当前域名下的
      // document.cookie = keys[i] + '=0;path=/;domain=' + document.domain + ';expires=' + new Date(0).toUTCString() //清除当前域名下的
      // document.cookie = keys[i] + '=0;path=/;domain=kevis.com;expires=' + new Date(0).toUTCString() //清除一级域名下的或指定的
    }
  }
}
  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值