269个JavaScript工具函数，助你提升工作效率（8）

Stella981
• 阅读 423

269个JavaScript工具函数，助你提升工作效率（8）

211.判断是否为数字

/** * @description 判断是否为数字 * @param value * @returns {boolean} */
   export function isNumber(value) {
   
     const reg = /^[0-9]*$/;
     return reg.test(value);
   }

212.判断是否是名称

/** * @description 判断是否是名称 * @param value * @returns {boolean} */
    export function isName(value) {
   
      const reg = /^[\u4e00-\u9fa5a-zA-Z0-9]+$/;
      return reg.test(value);
    }

213.判断是否为IP

/** * @description 判断是否为IP * @param ip * @returns {boolean} */
   export function isIP(ip) {
   
     const reg = /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
     return reg.test(ip);
   }

214.判断是否是传统网站

/** * @description 判断是否是传统网站 * @param url * @returns {boolean} */
   export function isUrl(url) {
   
     const reg = /^(https?|ftp):\/\/([a-zA-Z0-9.-]+(:[a-zA-Z0-9.&%$-]+)*@)*((25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9][0-9]?)(\.(25[0-5]|2[0-4][0-9]|1[0-9]{2}|[1-9]?[0-9])){3}|([a-zA-Z0-9-]+\.)*[a-zA-Z0-9-]+\.(com|edu|gov|int|mil|net|org|biz|arpa|info|name|pro|aero|coop|museum|[a-zA-Z]{2}))(:[0-9]+)*(\/($|[a-zA-Z0-9.,?'\\+&%$#=~_-]+))*$/;
     return reg.test(url);
   }

215.判断是否是小写字母

/** * @description 判断是否是小写字母 * @param str * @returns {boolean} */
   export function isLowerCase(str) {
   
     const reg = /^[a-z]+$/;
     return reg.test(str);
   }

216.判断是否是大写字母

/** * @description 判断是否是大写字母 * @param str * @returns {boolean} */
   export function isUpperCase(str) {
   
     const reg = /^[A-Z]+$/;
     return reg.test(str);
   }

217.判断是否是大写字母开头

/** * @description 判断是否是大写字母开头 * @param str * @returns {boolean} */
   export function isAlphabets(str) {
   
     const reg = /^[A-Za-z]+$/;
     return reg.test(str);
   }

218.判断是否是字符串

/** * @description 判断是否是字符串 * @param str * @returns {boolean} */
   export function isString(str) {
   
     return typeof str === "string" || str instanceof String;
   }

219.判断是否是数组

/** * @description 判断是否是数组 * @param arg * @returns {arg is any[]|boolean} */
  export function isArray(arg) {
   
     if (typeof Array.isArray === "undefined") {
   
   return Object.prototype.toString.call(arg) === "[object Array]";
     }
     return Array.isArray(arg);
   }

220.判断是否是端口号

/** * @description 判断是否是端口号 * @param str * @returns {boolean} */
   export function isPort(str) {
   
     const reg = /^([0-9]|[1-9]\d|[1-9]\d{2}|[1-9]\d{3}|[1-5]\d{4}|6[0-4]\d{3}|65[0-4]\d{2}|655[0-2]\d|6553[0-5])$/;
     return reg.test(str);
   }

221.判断是否是手机号

/** * @description 判断是否是手机号 * @param str * @returns {boolean} */
   export function isPhone(str) {
   
     const reg = /^1\d{10}$/;
     return reg.test(str);
   }

222.判断是否是身份证号(第二代)

/** * @description 判断是否是身份证号(第二代) * @param str * @returns {boolean} */
   export function isIdCard(str) {
   
     const reg = /^[1-9]\d{5}(18|19|([23]\d))\d{2}((0[1-9])|(10|11|12))(([0-2][1-9])|10|20|30|31)\d{3}[0-9Xx]$/;
     return reg.test(str);
   }

223.判断是否是邮箱

/** * @description 判断是否是邮箱 * @param str * @returns {boolean} */
   export function isEmail(str) {
   
     const reg = /^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
     return reg.test(str);
   }

224.判断是否中文

/** * @description 判断是否中文 * @param str * @returns {boolean} */
   export function isChina(str) {
   
     const reg = /^[\u4E00-\u9FA5]{2,4}$/;
     return reg.test(str);
   }

225.判断是否为空

/** * @description 判断是否为空 * @param str * @returns {boolean} */
      export function isBlank(str) {
   
        return (
    str == null ||
  false ||
   str === "" ||
   str.trim() === "" ||
   str.toLocaleLowerCase().trim() === "null"
     );
   }

226.判断是否为固话

/** * @description 判断是否为固话 * @param str * @returns {boolean} */
   export function isTel(str) {
   
     const reg = /^(400|800)([0-9\\-]{7,10})|(([0-9]{4}|[0-9]{3})(-| )?)?([0-9]{7,8})((-| |转)*([0-9]{1,4}))?$/;
     return reg.test(str);
   }

227.判断是否为数字且最多两位小数

/** * @description 判断是否为数字且最多两位小数 * @param str * @returns {boolean} */
   export function isNum(str) {
   
     const reg = /^\d+(\.\d{1,2})?$/;
     return reg.test(str);
   }

228.判断经度 -180.0～+180.0（整数部分为0～180，必须输入1到5位小数）

/** * @description 判断经度 -180.0～+180.0（整数部分为0～180，必须输入1到5位小数） * @param str * @returns {boolean} */
   export function isLongitude(str) {
   
     const reg = /^[-|+]?(0?\d{1,2}\.\d{1,5}|1[0-7]?\d{1}\.\d{1,5}|180\.0{1,5})$/;
     return reg.test(str);
   }

229.判断纬度 -90.0～+90.0（整数部分为0～90，必须输入1到5位小数）

/** * @description 判断纬度 -90.0～+90.0（整数部分为0～90，必须输入1到5位小数） * @param str * @returns {boolean} */
   export function isLatitude(str) {
   
     const reg = /^[-|+]?([0-8]?\d{1}\.\d{1,5}|90\.0{1,5})$/;
     return reg.test(str);
   }

230.rtsp校验只要有rtsp://

/** * @description rtsp校验，只要有rtsp:// * @param str * @returns {boolean} */
  export function isRTSP(str) {
   
     const reg = /^rtsp:\/\/([a-z]{0,10}:.{0,10}@)?(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/;
     const reg1 = /^rtsp:\/\/([a-z]{0,10}:.{0,10}@)?(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5]):[0-9]{1,5}/;
     const reg2 = /^rtsp:\/\/([a-z]{0,10}:.{0,10}@)?(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\//;
     return reg.test(str) || reg1.test(str) || reg2.test(str);
   }

231.判断IE浏览器版本和检测是否为非IE浏览器

function IEVersion() {
   
    var userAgent = navigator.userAgent; //取得浏览器的userAgent字符串 
    var isIE = userAgent.indexOf("compatible") > -1 && userAgent.indexOf("MSIE") > -1; //判断是否IE<11浏览器 
    var isEdge = userAgent.indexOf("Edge") > -1 && !isIE; //判断是否IE的Edge浏览器 
    var isIE11 = userAgent.indexOf('Trident') > -1 && userAgent.indexOf("rv:11.0") > -1;
    if (isIE) {
   
        var reIE = new RegExp("MSIE (\\d+\\.\\d+);");
        reIE.test(userAgent);
        var fIEVersion = parseFloat(RegExp["$1"]);
        if (fIEVersion == 7) {
   
            return 7;
        } else if (fIEVersion == 8) {
   
            return 8;
        } else if (fIEVersion == 9) {
   
            return 9;
        } else if (fIEVersion == 10) {
   
            return 10;
        } else {
   
            return 6; //IE版本<=7
        }
    } else if (isEdge) {
   
        return 'edge'; //edge
    } else if (isIE11) {
   
        return 11; //IE11 
    } else {
   
        return -1; //不是ie浏览器
    }
}

232.数组去重

方案一：Set + ...

function noRepeat(arr) {
   
  return [...new Set(arr)];
}
noRepeat([1,2,3,1,2,3])

方案二：Set + Array.from

function noRepeat(arr) {
   
  return Array.from(new Set(arr));
}
noRepeat([1,2,3,1,2,3])

方案三：双重遍历比对下标

function noRepeat(arr) {
   
  return arr.filter((v, idx)=>idx == arr.lastIndexOf(v))
}
noRepeat([1,2,3,1,2,3])

方案四：单遍历 + Object 特性

Object 的特性是 Key 不会重复。
这里使用 values 是因为可以保留类型，keys 会变成字符串。

function noRepeat(arr) {
   
  return Object.values(arr.reduce((s,n)=>{
   
    s[n] = n;
    return s
  },{
   }))
}
noRepeat([1,2,3,1,2,3])

后记

针对于上述的方案，还有其他变种实现。

233.查找数组最大

方案一：Math.max + ...

function arrayMax(arr) {
   
  return Math.max(...arr);
}
arrayMax([-1,-4,5,2,0])

方案二：Math.max + apply

function arrayMax(arr) {
   
  return Math.max.apply(Math, arr)
}
arrayMax([-1,-4,5,2,0])

方案三：Math.max + 遍历

function arrayMax(arr) {
   
  return arr.reduce((s,n)=>Math.max(s, n))
}
arrayMax([-1,-4,5,2,0])

方案四：比较、条件运算法 + 遍历

function arrayMax(arr) {
   
  return arr.reduce((s,n)=>s>n?s:n)
}
arrayMax([-1,-4,5,2,0])

方案五：排序

function arrayMax(arr) {
   
  return arr.sort((n,m)=>m-n)[0]
}
arrayMax([-1,-4,5,2,0])

234.查找数组最小

同上，_不明白为什么要分成两个题目_。

  1. Math.max 换成 Math.min
  2. s>n?s:n 换成 `s
  3. (n,m)=>m-n 换成 (n,m)=>n-m，或者直接取最后一个元素

235.返回已 size 为长度的数组分割的原数组

方案一：Array.from + slice

function chunk(arr, size = 1) {
   
  return Array.from(
    {
   
      length: Math.ceil(arr.length / size),
    },
    (v, i) => arr.slice(i * size, i * size + size)
  );
}
chunk([1,2,3,4,5,6,7,8],3)

方案二：Array.from + splice

function chunk(arr, size = 1) {
   
  return Array.from(
    {
   
      length: Math.ceil(arr.length / size),
    },
    (v, i) => arr.splice(0, size)
  );
}
chunk([1,2,3,4,5,6,7,8],3)

方案三：遍历 + splice

function chunk(arr, size = 1) {
   
    var _returnArr = [];
    while(arr.length){
   
        _returnArr.push(arr.splice(0, size))
    }
    return _returnArr
}
chunk([1,2,3,4,5,6,7,8],3)

检查数组中某元素出现的次数

方案一：reduce

function countOccurrences(arr, value) {
   
  return arr.reduce((a, v) => (v === value ? a + 1 : a + 0), 0);
}
countOccurrences([1,2,3,4,5,1,2,1,2,3], 1)

方案二：filter

function countOccurrences(arr, value) {
   
  return arr.filter(v=>v===value).length
}
countOccurrences([1,2,3,4,5,1,2,1,2,3], 1)

236.扁平化数组

方案一：递归 + …

function flatten(arr, depth = -1) {
   
  if (depth === -1) {
   
    return [].concat(
      ...arr.map((v) => (Array.isArray(v) ? this.flatten(v) : v))
    );
  }
  if (depth === 1) {
   
    return arr.reduce((a, v) => a.concat(v), []);
  }
  return arr.reduce(
    (a, v) => a.concat(Array.isArray(v) ? this.flatten(v, depth - 1) : v),
    []
  );
}
flatten([1,[2,[3]]])

方案二：es6 原生 flat

function flatten(arr, depth = Infinity) {
   
  return arr.flat(depth)
}
flatten([1,[2,[3]]])

对比两个数组并且返回其中不同的元素

方案一：filter + includes

他原文有问题，以下方法的 4,5 没有返回

function diffrence(arrA, arrB) {
   
  return arrA.filter((v) => !arrB.includes(v));
}
diffrence([1,2,3], [3,4,5,2])

需要再操作一遍

function diffrence(arrA, arrB) {
   
  return arrA.filter((v) => !arrB.includes(v))
    .concat(arrB.filter((v) => !arrA.includes(v)));
}
diffrence([1,2,3], [3,4,5,2])

方案二：hash + 遍历

算是方案1的变种吧，优化了 includes 的性能。

237.返回两个数组中相同的元素

方案一：filter + includes

function intersection(arr1, arr2) {
   
  return arr2.filter((v) => arr1.includes(v));
}
intersection([1,2,3], [3,4,5,2])

方案二：同理变种用 hash

function intersection(arr1, arr2) {
   
    var set = new Set(arr2)
  return arr1.filter((v) => set.has(v));
}
intersection([1,2,3], [3,4,5,2])

238.从右删除 n 个元素

方案一：slice

function dropRight(arr, n = 0) {
   
  return n < arr.length ? arr.slice(0, arr.length - n) : [];
}
dropRight([1,2,3,4,5], 2)

方案二: splice

function dropRight(arr, n = 0) {
   
  return arr.splice(0, arr.length - n)
}
dropRight([1,2,3,4,5], 2)

方案三: slice 另一种

function dropRight(arr, n = 0) {
   
  return arr.slice(0, -n)
}
dropRight([1,2,3,4,5], 2)

方案四: 修改 length

function dropRight(arr, n = 0) {
   
    arr.length = Math.max(arr.length - n, 0)
    return arr
}
dropRight([1,2,3,4,5], 2)

239.截取第一个符合条件的元素及其以后的元素

方案一：slice + 循环

function dropElements(arr, fn) {
   
  while (arr.length && !fn(arr[0])) arr = arr.slice(1);
  return arr;
}
dropElements([1,2,3,4,5,1,2,3], (v) => v == 2)

方案二：findIndex + slice

function dropElements(arr, fn) {
   
  return arr.slice(Math.max(arr.findIndex(fn), 0));
}
dropElements([1,2,3,4,5,1,2,3], (v) => v === 3)

方案三：splice + 循环

function dropElements(arr, fn) {
   
  while (arr.length && !fn(arr[0])) arr.splice(0,1);
  return arr;
}
dropElements([1,2,3,4,5,1,2,3], (v) => v == 2)

240.返回数组中下标间隔 nth 的元素

方案一：filter

function everyNth(arr, nth) {
   
  return arr.filter((v, i) => i % nth === nth - 1);
}
everyNth([1,2,3,4,5,6,7,8], 2)

方案二：方案一修改判断条件

function everyNth(arr, nth) {
   
  return arr.filter((v, i) => (i+1) % nth === 0);
}
everyNth([1,2,3,4,5,6,7,8], 2)
conststr函数param前端前端
点赞
收藏
评论区
推荐文章
blmius blmius
•
2年前
MySQL:[Err] 1292 - Incorrect datetime value: ‘0000-00-00 00:00:00‘ for column ‘CREATE_TIME‘ at row 1
文章目录问题用navicat导入数据时，报错：原因这是因为当前的MySQL不支持datetime为0的情况。解决修改sql\mode:sql\mode:SQLMode定义了MySQL应支持的SQL语法、数据校验等，这样可以更容易地在不同的环境中使用MySQL。全局s
3552
0
0
Karen110 Karen110
•
2年前
一篇文章带你了解JavaScript日期
日期对象允许您使用日期（年、月、日、小时、分钟、秒和毫秒）。一、JavaScript的日期格式一个JavaScript日期可以写为一个字符串:ThuFeb02201909:59:51GMT0800(中国标准时间)或者是一个数字:1486000791164写数字的日期，指定的毫秒数自1970年1月1日00:00:00到现在。1\.显示日期使用
1241
0
0
Jacquelyn38 Jacquelyn38
•
2年前
2020年前端实用代码段，为你的工作保驾护航
有空的时候，自己总结了几个代码段，在开发中也经常使用，谢谢。1、使用解构获取json数据let jsonData  id: 1,status: "OK",data: 'a', 'b';let  id, status, data: number   jsonData;console.log(id, status, number )
2027
0
0
helloworld_34035044 helloworld_34035044
•
1年前
皕杰报表之UUID
​在我们用皕杰报表工具设计填报报表时，如何在新增行里自动增加id呢？能新增整数排序id吗？目前可以在新增行里自动增加id，但只能用uuid函数增加UUID编码，不能新增整数排序id。uuid函数说明：获取一个UUID，可以在填报表中用来创建数据ID语法：uuid()或uuid(sep)参数说明：sep布尔值，生成的uuid中是否包含分隔符''，缺省为
806
0
0
Wesley13 Wesley13
•
2年前
mysql设置时区
mysql设置时区mysql\_query("SETtime\_zone'8:00'")ordie('时区设置失败，请联系管理员！');中国在东8区所以加8方法二：selectcount(user\_id)asdevice,CONVERT\_TZ(FROM\_UNIXTIME(reg\_time),'08:00','0
948
0
0
Wesley13 Wesley13
•
2年前
00：Java简单了解
浅谈Java之概述Java是SUN(StanfordUniversityNetwork)，斯坦福大学网络公司)1995年推出的一门高级编程语言。Java是一种面向Internet的编程语言。随着Java技术在web方面的不断成熟，已经成为Web应用程序的首选开发语言。Java是简单易学，完全面向对象，安全可靠，与平台无关的编程语言。
937
0
0
Stella981 Stella981
•
2年前
269个JavaScript工具函数，助你提升工作效率（6）
!269个JavaScript工具函数，助你提升工作效率.png(https://static.oschina.net/uploads/img/202009/11172428_tWo3.jpg)151.数组中某元素出现的次数/@param{array}arr@param{}va
484
0
0
Stella981 Stella981
•
2年前
Django中Admin中的一些参数配置
设置在列表中显示的字段，id为django模型默认的主键list_display('id','name','sex','profession','email','qq','phone','status','create_time')设置在列表可编辑字段list_editable
879
0
0
Wesley13 Wesley13
•
2年前
MySQL部分从库上面因为大量的临时表tmp_table造成慢查询
背景描述Time:20190124T00:08:14.70572408:00User@Host:@Id:Schema:sentrymetaLast_errno:0Killed:0Query_time:0.315758Lock_
1148
0
0
Python进阶者 Python进阶者
•
4个月前
Excel中这日期老是出来00：00：00，怎么用Pandas把这个去除
大家好，我是皮皮。一、前言前几天在Python白银交流群【上海新年人】问了一个Pandas数据筛选的问题。问题如下：这日期老是出来00：00：00，怎么把这个去除。二、实现过程后来【论草莓如何成为冻干莓】给了一个思路和代码如下：pd.toexcel之前把这
160
0
0
Stella981
Stella981
Lv1
接天莲叶无穷碧，映日荷花别样红。
文章
1.7w
粉丝
37
获赞
28
热门文章
OpenVPN下载、安装、配置及使用详解
GitHub神器，一个可以白嫖全网无损音乐的神器
OpenWrt 路由器过滤广告的N种方法
Python—执行系统命令的四种方法（os.system、os.popen、commands、subprocess）
SS端加密以及obfs混淆