汇总JS中有哪些另类的写法,代码是什么

Admin 2022-09-15 群英技术资讯 293 次浏览

这篇文章给大家分享的是“汇总JS中有哪些另类的写法,代码是什么”,对大家学习和理解有一定的参考价值和帮助,有这方面学习需要的朋友,接下来就跟随小编一起学习一下吧。

下面就是具体的写法,建议大家逐个测试一下,加深印象

1、转Boolean类型

这个较为常用。

!!'a'//true

通过两个取反,可以强制转换为Boolean类型。

!!是将表达式强制转化为bool值的运算,运算结果为true或false,表达式是什么值,结果就是对应的bool值,不再取非。

不是取非再取非的意思!!!

!!false=false;    要注意false和“false” 的区别!!!!!

!!"false"=true;

!!true=true;

!!(NaN || undefined || null || 0 || ' ')=false;

2、转Number类型

String转化为Number;日期输出时间戳。

+'45'//45
+new Date//13位时间戳

会自动转化为Number类型的。日期取时间戳不用new Date().getTime()。

3、parseInt

parseInt这个函数太普通了,怎么能装逼。答案是~~,这种方法还可以将字符串转换成数字类型。向下取整。

~~3.14159//3
~~'5.678'//5
-2.33 | 0 //-2
2.33 >> 0 //2

原理是~是一个叫做按位非的操作,会返回数值的反码,两次取反就是原数。|为位运算符,两个位只要有一个为1,那么结果都为1,否则就为0。>>运算符执行有符号右移位运算。都是二进制操作。 原因在于JavaScript中的number都是double类型的,在位操作的时候要转化成int。

4、短路表达式,弃用if-else

反面示例:

if () { 
// ... 
} else if () { 
// ... 
} else { 
// ... 
}

用 || 和 &&来简化if-else 。有时候用 !! 操作符也能简化if-else模式。例如这样:

let a = b || 1;//b为真,a=b;b为假,a=1; 
let c = b && 1;//b为真,c=1;b为假,c=b; 
// 使用!!符号 
let isValid = !!(value && value !== 'error');

“!”是取反操作,两个“!”自然是负负得正了。比较常用的是||。

5、另外一种undefined

let data = void 0; // undefined

void 运算符 对给定的表达式进行求值,然后返回 undefined。
那为什么要用void 0,不直接undefined呢? undefined在javascript中不是保留字。因此在IE5.5~8中我们可以将其当作变量那样对其赋值(IE9+及其他现代浏览器中赋值给undefined将无效)。采用void方式获取undefined更准确。

6、保留指定位数的小数点

let num = 2.443242342; 
num = num.toFixed(4); //"2.4432"

注意, toFixed() 方法返回的是字符串而不是一个数字。

7、单行写一个评级组件

let rate = 3; 
"".slice(5 - rate, 10 - rate);//""

slice() 方法可提取字符串的某个部分,并以新的字符串返回被提取的部分stringObject.slice(start,end)

8、金钱格式化

//正则 
let cash = '1234567890' 
cash.replace(/\B(?=(\d{3})+(?!\d))/g, ',');//"1,234,567,890" 
//非正则的优雅实现 
function formatCash(str) { 
 return str.split('').reverse().reduce((prev, next, index) => { 
 return ((index % 3) ? next : (next + ',')) + prev 
 }) 
} 
formatCash(cash);//"1,234,567,890"

非正则的方法,先把字符串转成了数组,反转了一下变成了[0,9,8,7,6,5,4,3,2,1]。再对新的数组进行reduce操作,数组元素位置除3取余,是3的倍数的位置就增加',',最后返回累加的字符串。

9、标准JSON的深拷贝

let a = { 
 a1: 1, 
 b1: { c: 1, d: 2 } 
}; 
let b=JSON.parse(JSON.stringify(a)); 
b;//{a1: 1, b1: {…}}

不考虑IE的情况下,标准JSON格式的对象蛮实用,不过对于undefined和function的会忽略掉。

10、数组去重

阿里面试官,喜欢问这个问题。

let array=[1, "1", 2, 1, 1, 3]; 
//拓展运算符(...)内部使用for...of循环 
[...new Set(array)];//[1, "1", 2, 3\] 
//利用Array.from将Set结构转换成数组 
Array.from(new Set(array));//[1, "1", 2, 3\]

传统的方法,循环遍历:排序sort()后前一下与后一个比较==;在数组中用indexOf判断,利用includes,利用filter;这些方法感觉都过时了,还是用ES6中利用Set去重比较牛。

11、取数组中的最大值和最小值

Math.max方法可以求出给定参数中最大的数。

 Math.max('1','2','3.1','3.2');//3.2 
 Math.min(1,0,-1);//-1

但如果是数组,就不能这样调用了。此时就用到了apply方法。Function.apply()是JS的一个OOP特性,一般用来模拟继承和扩展this的用途。所有函数都有apply(作用域链,参数)这个方法,当作用域链为null时,默认为上文,这个函数的“参数”,接收一个数组。

let arr = ['1','2','3.1','3.2',0,-1]; 
//用apply方法 
Math.max.apply(null, arr);//3.2 
Math.min.apply(Math, arr);//-1 
//用拓展运算符 
Math.max(...arr);//3.2 
Math.min(...arr);//-1

以上就是关于“汇总JS中有哪些另类的写法,代码是什么”的相关知识,感谢各位的阅读,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注群英网络,小编每天都会为大家更新不同的知识。
群英智防CDN,智能加速解决方案
标签: js

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:mmqy2019@163.com进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容。

猜你喜欢

成为群英会员,开启智能安全云计算之旅

立即注册
专业资深工程师驻守
7X24小时快速响应
一站式无忧技术支持
免费备案服务
免费拨打  400-678-4567
免费拨打  400-678-4567 免费拨打 400-678-4567 或 0668-2555555
在线客服
微信公众号
返回顶部
返回顶部 返回顶部
在线客服
在线客服