博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
web前端小工具
阅读量:7081 次
发布时间:2019-06-28

本文共 6975 字,大约阅读时间需要 23 分钟。

web开发工程中,有很多很简单,但是就是想不起来怎么写,还有就是想起怎么写,每次都要重新写,好苦恼,并且这是好无聊的工作,明明很简单,明明闭着眼都可以写的代码,每次都要写一遍。

好了 ,这是在我开发过程中遇到的一些繁琐,并且简单的小工具,在这里统一写一下。以后能用到的可以直接copy了,稍加改造就是一个小工具。

1、返回数据的格式化,将其改为json

export const JsonParse = (data) => {  try {    var appDocument = document.getElementById('app')    var appParent = appDocument.parentNode.childNodes    for (var ele of appParent) {      if (ele.nodeName === 'DIV' && ele.id !== 'app') {        console.info('this si ID name is ' + ele.id)        ele.style.display = 'none'      }    }  } catch (err) {    console.log(err)  }  try {    return JSON.parse(data)  } catch (e) {    try {      return JSON.parse(data.toString())    } catch (ex) {      return JSON.parse(JSON.stringify(data))    }  }}

2、时间格式化

// 时间格式化export const formatTime = (date) => {  var year = date.getFullYear()  var month = date.getMonth() + 1  var day = date.getDate()  var hour = date.getHours()  var minute = date.getMinutes()  var second = date.getSeconds()  return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')}

3、数字检验,检查输入的是不是 number

// 数字校验export const formatNumber = (n) => {  // n = n.toString()  // return n[1] ? n : '0' + n  var partten = /^\d/  return partten.test(n)}

4、判断是否是两位小数

// 判断是否是两位小数export const checktwoPoint = (inputNumber) => {  var partten = /^\d+(\.\d{1,2})?$/  if (partten.test(inputNumber)) {    return true  } else {    return false  }}

5、强制保留2位小数,如:2,会在2后面补上00.即2.00

//强制保留2位小数,如:2,会在2后面补上00.即2.00export const toDecimal2 = (x) => {  var f = parseFloat(x);  if(isNaN(f)) {    return false;  }  var f = Math.round(x * 100) / 100;  var s = f.toString();  var rs = s.indexOf('.');  if(rs < 0) {    rs = s.length;    s += '.';  }  while (s.length <= rs + 2) {    s += '0';  }  return s;}

6、 判断是否输入中文

// 判断是否输入中文export const isChineseChar = (str) => {  var reg = /[\u4E00-\u9FA5\uF900-\uFA2D]/  return reg.test(str)}

7、判断输入是否为合法的手机号码

// 判断输入是否为合法的手机号码export const isphoneNumber = (inputString) => {  var partten = /^1[3,4,5,7,8]\d{9}$/  if (partten.test(inputString)) {    return true  } else {    return false  }}

8、计算时长,将小时数转为天数

// 计算时长export const calcRemainderTime = (time) => {  if (time <= 0) {    return '0小时'  }  var day = Math.floor(time / 24)  var hour = time % 24  time = (day === 0 ? time + '小时' : day + '天' + (hour === 0 ? '' : hour + '小时'))  return time}

9、 颜色随机选择,从几个颜色当中随机选取颜色

// 颜色随机选择export const randomLabelBg = () => {  var colors = ['#9ed5ff', '#c09eff', '#ffc99e', '#ff9ece', '#9ec0ff', '#80c488', '#fc9055']  var index = Math.floor(Math.random() * colors.length)  return colors[index]}

10、随机抓取分享名字

// 随机抓取分享名字export const randomShareName = () => {  let nameList = ['Sophie dream','且做沧桑酒✨',' 莳光ぴ浅逝丶','法学顽童   __Alone°','独自','立正喊凯哥',' I n s v o w - 清','对方正在输入...',    '甚麽楠呐,','一笑一倾城','笙笙慢','末有枝','绅士的演员-韩','*丶海阔天空','起跑的终点','紫色`薰衣草','我们大手牵小手','壹初倾城','Smile Again~']  var name = Math.floor(Math.random() * nameList.length)  return nameList[name]}

11、非空判断

export const isNull = (args) => {  if (args === null || args === 'null' || args === undefined || args === 'undefined' || args === '' || args.length === 0) {    return true  }}

12、银行卡校验

// 银行卡校验export const isBankCardNo = (bankNo) => {  var num = /^\d*$/  if (bankNo.length < 16 || bankNo.length > 19 || !num.test(bankNo)) {    return false  }  return true}

12、身份证验证

// 身份证验证export const ispCardNo = (cardNo) => {  // 身份证号码为15位或者18位,15位时全为数字,18位前17位为数字,最后一位是校验位,可能为数字或字符X  var reg = /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/  if (reg.test(cardNo) === false) {    return false  }  return true}

13、校验移动端设备是不是iOS

// 校验移动端设备是不是iOSexport const getDeviceTypeIsiOS = () => {  var u = navigator.userAgent  var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)  if (isiOS === true) {    console.log('当前设备是iOS')  } else {    console.log('当前设备是Android')  }}

14、 获取当前设备是android还是iOS

// 获取当前设备是android还是iOSexport const getDeviceType = () => {  var u = navigator.userAgent//      var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1  var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/)  if (isiOS === true) {    console.log('当前设备是iOS')  } else {    console.log('当前设备是Android')  }  return isiOS}

15、从数组中删除指定的元素

// 从数组中删除指定的元素export const removeByValue = (arr, val) =>{  for(var i=0; i

16、从cookie中获取值

// 从cookie中获取值export const getCookie = (sName) => {  var aCookie = document.cookie.split("; ");  for (var i=0; i < aCookie.length; i++)  {    var aCrumb = aCookie[i].split("=");    if (sName == aCrumb[0])      return aCrumb[1];  }  return null;}

17、删除指定cookie

// 删除cookieexport function delCookie (name) {  var exp = new Date();  exp.setTime(exp.getTime() - 1);  var cval = getCookie(name);  if (cval != null) {    document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString();  }}

18、删除所有cookie

// 删除所有cookieexport const delAllCookie = () =>{  var myDate=new Date();  myDate.setTime(-1000);//设置时间  var data=document.cookie;  var dataArray=data.split("; ");  for(var i=0;i

19、时间格式化 将时间戳或者时间格式初始化

export const formatTime = (date) => {  var year = date.getFullYear()  var month = date.getMonth() + 1  var day = date.getDate()  var hour = date.getHours()  var minute = date.getMinutes()  var second = date.getSeconds()  return [year, month, day].map(formatNumber).join('/') + ' ' + [hour, minute, second].map(formatNumber).join(':')}

20、正整数

export const checkIsNumber = (n) => {  var r = /^[0-9]*[0-9][0-9]*$/  return r.test(n)}

21、保留小数点后两位小数,如果含有多于两个小数点则第二位小数点进一

var changeNum = function(num) {    var b = num.toString();    if (b.indexOf('.') < 0) {        console.info('1==========')        console.info(num)        return num    } else if (b.indexOf('.') > 0) {        var d = b.split(".")[1].length;        if (d > 2) {            console.info('2==========')            console.info(parseFloat(num.toFixed(2))+0.01);            return parseFloat(num.toFixed(2))+0.01        } else {            console.info('3==========')            console.info(num)            return num;        }    }};

22、判空

// 判空export const isNull = (args) => {  if (args === null || args === 'null' || args === undefined || args === 'undefined' || args === '' || args.length === 0) {    return true  }}

23、检查图片是否为全路径

export const changeImgUrl = (newUrl) => {  let isChange = newUrl.indexOf("http");  let urlPrefix = "http://img.gxcards.com/";  if(isChange > -1){    return newUrl;  } else if(isChange < 0){    return urlPrefix + newUrl;  }};

24、将对象转换为数组

export const  transform = (obj) =>{  var arr = [];  for(let item in obj){    let goodAttr = {      key:item,      value:obj[item]    };    arr.push(goodAttr);  }  return arr;}

25、去掉空格

export const trim =(str) =>{  var result;  result = str.replace(/(^\s+)|(\s+$)/g,"");  result = result.replace(/\s/g,"");  return result;}

26、数组去重

// 数组去重export const unique = (list) =>{  var res = [];  var json = {};  for(var i = 0; i < list.length; i++){    if(!json[list[i]]){      res.push(list[i]);      json[list[i]] = 1;    }  }  return res;};

 

转载于:https://my.oschina.net/wsxiao/blog/1575191

你可能感兴趣的文章
JavaScript实现百度搜索页面
查看>>
asp.net core 依赖注入实现全过程粗略剖析(3)
查看>>
Servlet表单数据
查看>>
du及df命令的使用
查看>>
maven的install和deploy的区别
查看>>
请求http服务
查看>>
使用IIS应用程序初始化来保持ASP.NET应用程序的活动
查看>>
腾讯云使用
查看>>
数据结构02
查看>>
CheckBox的全选与不全选(刷新页面效果) .
查看>>
js使用post 方式打开新窗口,隐藏Url参数
查看>>
.CO域名快被这帮搞IT的玩坏了……
查看>>
C++ Primer 有感(异常处理)(二)
查看>>
Beginning Linux Programming 学习--chapter 17 Programming KDE using QT
查看>>
C#的Main(String[] args)参数输入问题
查看>>
7-4 是否同一棵二叉搜索树
查看>>
Handler,Message,Runnable和多线程的理解
查看>>
mysql 的 GROUP_CONCAT
查看>>
需求分析(二)
查看>>
Cocos Creator 对象池cc.NodePool的使用
查看>>