utils封装汇总(待增加)

vue项目中经常会自己封装一些函数,在项目中方便多处调用.这里给出一部分我自己封装以及收集的仅供参考.

//util.js 常用汇总
/*
@1 local 浏览器数据存储方式封装 set  get clear
@2 joinReqParams 拼接请求参数
@3 deviceType  移动设备的类型
@4 formDate 时间转换  
@5 remainTime格式化剩余时间   
@6 timeDiff 计算两段时间差 
@7 dateGet 获取时间汇总
*/

//@1 +++++++++ 浏览器储存数据方式封装,
//默认使用localstorage存储,若浏览器不支持则用cookie存储 +++++++++++

let local = {
  set(key, value) {
    if (checkLocalStorage()) {
      window.localStorage.setItem(key, value);
    } else {
      let Days = 30;
      let exp = new Date();
      exp.setTime(exp.getTime() + Days * 24 * 60 * 60 * 1000);
      document.cookie = key + '=' + escape(value) + ';expires=' + exp.toGMTString();
    }
  },
  get(key) {
    if (checkLocalStorage()) {
      return window.localStorage.getItem(key) ? window.localStorage.getItem(key) : null;
    } else {
      return getCookie(key);
    }
  },
  clear(key) {
    if (checkLocalStorage()) {
      key ? window.localStorage.removeItem(key) : window.localStorage.clear();
    } else {
      let exp = new Date();
      exp.setTime(exp.getTime() - 1);
      let cval = getCookie(key);
      if (cval != null) document.cookie = key + '=' + cval + ';expires=' + exp.toGMTString();
    }
  }
};

function checkLocalStorage() {
  //确认是否支持Localstorage
  return window.localStorage && (window.localStorage.setItem('a', 123), window.localStorage.getItem('a') == 123)
    ? true
    : false;
}
function getCookie(name) {
  let arr,
    reg = new RegExp('(^| )' + name + '=([^;]*)(;|$)');
  if ((arr = document.cookie.match(reg))) return unescape(arr[2]);
  else return null;
}

//@2 joinReqParams 拼接请求参数
function joinReqParams(obj) {
  let params = Object.values(obj).reduce((a, b, i) => `${a}${Object.keys(obj)[i]}=${b}&`, '?');
  return params.substring(0, params.length - 1);
}

//@3 deviceType  移动设备的类型  文件引用有误暂时注释
/*
const UA = navigator.userAgent;
let deviceType = {
  isAndroid: /android|adr/gi.test(UA),
  isIos: /iphone|ipod|ipad/gi.test(UA) && !this.isAndroid,
  isWeixin: /MicroMessenger/gi.test(UA),
  isQQ: /QQ\/\d/gi.test(UA),
  isClient: this.isWeixin || this.isQQ,
  isChrome: /Chrome\/([\d.]+)/gi.test(UA) || /CriOS\/([\d.]+)/gi.test(UA),
  isIosWebview: !this.isChrome && /(iPhone|iPod|iPad).*AppleWebKit(?!.*Safari)/gi.test(UA)
};
*/

// @4  +++++ 时间转换封装 ++++++ "YY年MM月DD日 hh时mm分ss秒"

function formDate(time = new Date(), format = 'YY-MM-DD hh:mm:ss') {
  const v_list = {
    //年
    YY: time.getFullYear(),
    //月
    MM: time.getMonth() + 1 < 10 ? '0' + (time.getMonth() + 1) : time.getMonth() + 1,
    //日
    DD: time.getDate() < 10 ? '0' + time.getDate() : time.getDate(),
    //时
    hh: time.getHours() < 10 ? '0' + time.getHours() : time.getHours(),
    //分
    mm: time.getMinutes() < 10 ? '0' + time.getMinutes() : time.getMinutes(),
    //秒
    ss: time.getSeconds() < 10 ? '0' + time.getSeconds() : time.getSeconds()
  };
  return [
    {
      id: format.indexOf('YY'),
      v: v_list.YY + format.charAt(format.indexOf('YY') + 2)
    },
    {
      id: format.indexOf('MM'),
      v: v_list.MM + format.charAt(format.indexOf('MM') + 2)
    },
    {
      id: format.indexOf('DD'),
      v: v_list.DD + format.charAt(format.indexOf('DD') + 2)
    },
    {
      id: format.indexOf('hh'),
      v: v_list.hh + format.charAt(format.indexOf('hh') + 2)
    },
    {
      id: format.indexOf('mm'),
      v: v_list.mm + format.charAt(format.indexOf('mm') + 2)
    },
    {
      id: format.indexOf('ss'),
      v: v_list.ss + format.charAt(format.indexOf('ss') + 2)
    }
  ]
    .filter(v => v.id > -1)
    .reduce((a, b) => a + b.v, '');
}

//@5 格式化剩余时间
function remainTime(num, format = 'hh:mm:ss') {
  if (!num) return '00:00:00';
  num /= 1000;
  let h = parseInt(num / 3600),
    m = parseInt(num / 60),
    s = parseInt(num % 60);
  const v_list = {
    //时
    hh: (h > 60 ? (h -= 60) : h) < 10 ? '0' + h : h,
    //分
    mm: (m > 60 ? (m -= 60) : m) < 10 ? '0' + m : m,
    //秒
    ss: (s > 60 ? (s -= 60) : s) < 10 ? '0' + s : s
  };
  return [
    {
      id: format.indexOf('hh'),
      v: v_list.hh + format.charAt(format.indexOf('hh') + 2)
    },
    {
      id: format.indexOf('mm'),
      v: v_list.mm + format.charAt(format.indexOf('mm') + 2)
    },
    {
      id: format.indexOf('ss'),
      v: v_list.ss + format.charAt(format.indexOf('ss') + 2)
    }
  ]
    .filter(v => v.id > -1)
    .reduce((a, b) => a + b.v, '');
}

//@6 timeDiff 计算两段时间差 时分秒 startTime 这里是时间类型 ==>'2018/05/01 00:00:00'
//   endTime 这里是new Date()出来的  一般是即时的
function timeDiff(startTime, endTime) {
  let date1 = startTime; //开始时间
  let date2 = endTime; //结束时间
  let date3 = date2.getTime() - new Date(date1).getTime();
  //计算出相差天数
  let days = Math.floor(date3 / (24 * 3600 * 1000));
  //计算出小时数
  let leave1 = date3 % (24 * 3600 * 1000); //计算天数后剩余的毫秒数
  let hours = Math.floor(leave1 / (3600 * 1000)) + days * 24; //这里计算时间差要以小时为单位
  let hours2 = Math.floor(leave1 / (3600 * 1000));
  if (hours < 10) hours = `0${hours}`;
  //计算相差分钟数
  let leave2 = leave1 % (3600 * 1000); //计算小时数后剩余的毫秒数
  let minutes = Math.floor(leave2 / (60 * 1000));
  if (minutes < 10) minutes = `0${minutes}`;
  //计算相差秒数
  let leave3 = leave2 % (60 * 1000); //计算分钟数后剩余的毫秒数
  let seconds = Math.round(leave3 / 1000);
  if (seconds < 10) seconds = `0${seconds}`;
  const timeDiffrence = `${hours}:${minutes}:${seconds}`; //时间差包括天数
  const timeDiffrence2 = `${days}天${hours}时${minutes}分${seconds}秒`;
  return timeDiffrence;
}

//@7 dateGet 获取日期 +++++++++++ 获取日期汇总 ++++++++++++
/*
let date = {
  datepick:computeDay(dates), 天数加减,返回当天的日期
  dateCurrent:getCurrentWeek(),  获取本周的日期
  dateLastWeek:getLastWeek(), 获取上周的时间
  dateMonth:computeMonth(),月份加减,返回第一天和最后一天的日期
  dateCurrMonth:getCurrentMonth(),本月的时间
  dateLastMonth:getLastMonth(),返回上月的时间
}
*/
// 天数加减,m返回当天的日期
function computeDay(dates = 0) {
  let t = new Date();
  t.setDate(t.getDate() + dates);
  let y = t.getFullYear();
  let m = t.getMonth() + 1;
  let d = t.getDate();
  return `${y}-${m < 10 ? '0' + m : m}-${d < 10 ? '0' + d : d}`;
}
// 获取本周的时间
function getCurrentWeek() {
  let d = new Date();
  let day = d.getDay();
  let c = day != 0 ? day - 1 : 6;
  return [computeDay(c - 6), computeDay(c)];
}
// 获取上周的时间
function getLastWeek() {
  let d = new Date();
  let day = d.getDay();
  let c = day != 0 ? day - 1 : 6;
  return [computeDay(c - (6 + 7)), computeDay(c - 7)];
}
// 月份加减,返回第一天和最后一天日期
function computeMonth(months = 0) {
  let t = new Date();
  if (months) {
    t.setMonth(t.getMonth() + months);
  }
  let y = t.getFullYear();
  let m = t.getMonth() + 1;
  let d = 0;
  if (~[1, 3, 5, 7, 8, 10, 12].indexOf(m)) {
    d = 31;
  } else if (m == 2) {
    // 判断是否为闰年(能被4整除且不能被100整除 或 能被100整除且能被400整除)
    if ((y % 4 == 0 && y % 100 != 0) || (y % 100 == 0 && y % 400 == 0)) {
      d = 29;
    } else {
      d = 28;
    }
  } else {
    d = 30;
  }
  return [`${y}-${m < 10 ? '0' + m : m}-${1}`, `${y}-${m < 10 ? '0' + m : m}-${d < 10 ? '0' + d : d}`];
}

// 获取本月的时间
function getCurrentMonth() {
  return computeMonth();
}

// 获取上月的时间
function getLastMonth() {
  return computeMonth(-1);
}

//动态获取本机的IP地址
const getIPAdress = () => {
    let localIPAddress = "";
    let interfaces = require('os').networkInterfaces();
    for (let devName in interfaces) {
      let iface = interfaces[devName];
        for (let i = 0; i < iface.length; i++) {
        let alias = iface[i];
        if (alias.family === 'IPv4' && alias.address !== '127.0.0.1' && !alias.internal) {
          localIPAddress = alias.address;
            }
        }
    }
return localIPAddress;
}



最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 194,390评论 5 459
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 81,821评论 2 371
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 141,632评论 0 319
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 52,170评论 1 263
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 61,033评论 4 355
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 46,098评论 1 272
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 36,511评论 3 381
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 35,204评论 0 253
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 39,479评论 1 290
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 34,572评论 2 309
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 36,341评论 1 326
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,213评论 3 312
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 37,576评论 3 298
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 28,893评论 0 17
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,171评论 1 250
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 41,486评论 2 341
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 40,676评论 2 335

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 171,050评论 25 707
  • CHAPTER 14 “我没子弹了!”威士忌解决最后一个敌人,却看到另一辆雪地车向着他们的方向飞驰而来,他赶紧将鞭...
    gibacat阅读 448评论 0 1
  • 一个学期 一个班级 我们终究会分离 这就是时间末端 也是开始
    北方有琴南阅读 411评论 0 1
  • 参加心蓝老师的第二节课。 一直画,很上瘾了。 学会了用硫酸纸。请老师多多指教。
    尚影ETONG阅读 322评论 2 7
  • 我用南方的艳阳缝补千里冰封 我用北方的孤寒撑起阡陌斜阳 大漠的簪带着沉沙 挽起瑾年斑驳 离群的雁 带着烟雨蒙蒙的希...
    月伴霜林醉阅读 364评论 1 3