实用的js操作小技巧

虽条条大路通罗马,何不择优选择一条,一些很实用的js小技巧,可以优雅的简化代码

1.数组获取最大/最小值

可以使用 Math.min() 或 Math.max() 结合扩展运算符来查找数组中的最小值或最大值。

const numbers = [6, 8, 1, 3, 9];

console.log(Math.max(...numbers)); // 9
console.log(Math.min(...numbers)); // 1  

2.设置 length 属性来缩短数组 

let array = [1,2,3,4,5,6]
array.length = 3
console.log(array) //[123]

3.简写条件判断语句 

(1)单纯判断true或false的情况:

if(isShow) {
  this.doNow()
}
//可简写为
isShow && this.doShow()

(2) 多条判断语句的情况

if(this.nowIndex == 1 || this.nowIndex == 5 || this.nowIndex == 8) {
  this.doNow()
}
//可以写为
if([1,5,8].includes(this.nowIndex)) {
  this.doNow()
}

4.数组去重 

let array = [2,2,4,4,5]
console.log([...new Set(array)]) //[2,4,5]

5.数字类型与字符串类型的互转

//数字类型转字符串类型
let number = 666
console.log(number + '') //'666'
//字符串转数字
let strings = '666'
console.log(+strings) // 666

6.数组中过滤掉所有虚值 

let arrays = [66,undefined,NaN,null,'字符串',55,false,true]
console.log(arrays.filter(Boolean)) //[66,'字符串',55,true]

7.妙用 reduce对数组进行求和

let array = [20,30,40,10]
let rudecers = (leftvalue,nextvalue) => leftvalue + nextvalue
console.log(array.reduce(rudecers)) //100

8.正则表达式的总结 

//用户名正则,4到16位(字母,数字,下划线,减号)
var uPattern = /^[a-zA-Z0-9_-]{4,16}$/;
//输出 true
console.log(uPattern.test("caibaojian"));

------------------------------------------------------------------------------

//密码强度正则,最少6位,包括至少1个大写字母,1个小写字母,1个数字,1个特殊字符
var pPattern = /^.*(?=.{6,})(?=.*d)(?=.*[A-Z])(?=.*[a-z])(?=.*[!@#$%^&*? ]).*$/;
//输出 true
console.log("=="+pPattern.test("caibaojian#"));

-------------------------------------------------------------------------------

//正整数正则
var posPattern = /^d+$/;
//负整数正则
var negPattern = /^-d+$/;
//整数正则
var intPattern = /^-?d+$/;
//输出 true
console.log(posPattern.test("42"));
//输出 true
console.log(negPattern.test("-42"));
//输出 true
console.log(intPattern.test("-42"));

-------------------------------------------------------------------------------

//正数正则
var posPattern = /^d*.?d+$/;
//负数正则
var negPattern = /^-d*.?d+$/;
//数字正则
var numPattern = /^-?d*.?d+$/;
console.log(posPattern.test("42.2"));
console.log(negPattern.test("-42.2"));
console.log(numPattern.test("-42.2"));

-------------------------------------------------------------------------------

//Email正则
var ePattern = /^([A-Za-z0-9_-.])+@([A-Za-z0-9_-.])+.([A-Za-z]{2,4})$/;
//输出 true
console.log(ePattern.test("99154507@qq.com"));

-------------------------------------------------------------------------------

//手机号正则
var mPattern = /^1[34578]d{9}$/; //http://caibaojian.com/regexp-example.html
//输出 true
console.log(mPattern.test("15507621888"));

-------------------------------------------------------------------------------

//身份证号(18位)正则
var cP = /^[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]$/;
//输出 true
console.log(cP.test("11010519880605371X"));

-------------------------------------------------------------------------------

//URL正则
var urlP= /^((https?|ftp|file)://)?([da-z.-]+).([a-z.]{2,6})([/w .-]*)*/?$/;
//输出 true
console.log(urlP.test("http://caibaojian.com.cn"));

-------------------------------------------------------------------------------

//ipv4地址正则
var ipP = /^(?:(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?).){3}(?:25[0-5]|2[0-4][0-9]|[01]?[0-9][0-9]?)$/;
//输出 true
console.log(ipP.test("115.28.47.26"));

-------------------------------------------------------------------------------

//RGB Hex颜色正则
var cPattern = /^#?([a-fA-F0-9]{6}|[a-fA-F0-9]{3})$/;
//输出 true
console.log(cPattern.test("#b8b8b8"));

-------------------------------------------------------------------------------

//日期正则,简单判定,未做月份及日期的判定
var dP1 = /^d{4}(-)d{1,2}1d{1,2}$/;
//输出 true
console.log(dP1.test("2017-05-11"));
//输出 true
console.log(dP1.test("2017-15-11"));
//日期正则,复杂判定
var dP2 = /^(?:(?!0000)[0-9]{4}-(?:(?:0[1-9]|1[0-2])-(?:0[1-9]|1[0-9]|2[0-8])|(?:0[13-9]|1[0-2])-(?:29|30)|(?:0[13578]|1[02])-31)|(?:[0-9]{2}(?:0[48]|[2468][048]|[13579][26])|(?:0[48]|[2468][048]|[13579][26])00)-02-29)$/;
//输出 true
console.log(dP2.test("2017-02-11"));
//输出 false
console.log(dP2.test("2017-15-11"));
//输出 false
console.log(dP2.test("2017-02-29"));

-------------------------------------------------------------------------------

//QQ号正则,5至11位
var qqPattern = /^[1-9][0-9]{4,10}$/;
//输出 true
console.log(qqPattern.test("65974040"));

-------------------------------------------------------------------------------

//微信号正则,6至20位,以字母开头,字母,数字,减号,下划线
var wxPattern = /^[a-zA-Z]([-_a-zA-Z0-9]{5,19})+$/;
//输出 true
console.log(wxPattern.test("caibaojian_com"));

-------------------------------------------------------------------------------

//车牌号正则
var cPattern = /^[京津沪渝冀豫云辽黑湘皖鲁新苏浙赣鄂桂甘晋蒙陕吉闽贵粤青藏川宁琼使领A-Z]{1}[A-Z]{1}[A-Z0-9]{4}[A-Z0-9挂学警港澳]{1}$/;
//输出 true
console.log(cPattern.test("粤B39006"));

-------------------------------------------------------------------------------

//包含中文正则
var cnPattern = /[u4E00-u9FA5]/;
//输出 true
console.log(cnPattern.test("蔡宝坚"));


 这会儿忙了,之后持续更新

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值