JavaScript 装逼指南(js另类写法)

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

这个较为常用。

!!’a’//true

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

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

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

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

!!'false'=true;

!!true=true;

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

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

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

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

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

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

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

十六进制操作。其实就是一个Array.prototype.toString(16)的用法看到这个词脑袋里冒出的肯定是CSS的颜色。

做到随机的话可以这样

(~~(Math.random()*(1<<24))).toString(16)

底下的原文链接非常建议去读一下，后三个技巧都是在那里学到的。«左移操作。这个操作特别叼。一般得玩 C 玩得多的，这个操作会懂一些。一般半路出家的前端码农可能不太了解(说的是我 ☹)。这个也是二进制操作。将数值二进制左移解释上面的1<<24的操作。其实是1左移24位。000000000000000000000001左移24位，变成了1000000000000000000000000不信？试着在console粘贴下面的代码

parseInt(’1000000000000000000000000’, 2) === (1 << 24)

其实还有一种更容易理解的方法来解释

Math.pow(2,24) === (1 << 24)

因为是二进制操作，所以速度是很快的。

反面示例：

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’);

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

另外一种undefined

let data = void 0; // undefined

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

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

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

let rate = 3; '★★★★★☆☆☆☆☆'.slice(5 - rate, 10 - rate);//'★★★☆☆'

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

//正则 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的倍数的位置就增加’,’，最后返回累加的字符串。

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

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

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

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去重比较牛。

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);//-1IIFE

这个其实非常有实用价值，不算是装逼。只是其他语言里没有这么玩的，给不太了解js的同学看那可牛逼大了。

(function(arg) { // do something})(arg)

实用价值在于可以防止全局污染。不过现在随着ES2015的普及已经没什么必要用这个了，我相信五年之后，这种写法就会逐渐没落。

自己干五年，在实习生面前装逼用也是蛮不错的嘛~

[].forEach.call($$('*'),function(a){ a.style.outline='1px solid #'+(~~(Math.random()*(1<<24))).toString(16)})

翻译成正常语言就是这样的

Array.prototype.forEach.call(document.querySelectorAll(’*’), dom => dom.style.outline = `1px solid #${parseInt(Math.random() * Math.pow(2,24)).toString(16)}`)Event

事件响应前端肯定都写烂了，一般来说如何写一个计数器呢？

var times = 0var foo = document.querySelector(’.foo’)foo.addEventListener(’click’, function() { times++ console.log(times)}, false)

好像是没什么问题哦，但是！变量times为什么放在外面，就用了一次放在外面，命名冲突了怎么办，或者万一在外面修改了怎么办。

这个时候这样一个事件监听代码就比较牛逼了

foo.addEventListener(’click’, (function() { var times = 0 return function() { times++ console.log(times) }})(), false)

怎么样，是不是立刻感觉不一样了。瞬间逼格高了起来！

通过创建一个闭包，把times封装到里面，然后返回函数。这个用法不太常见。

以上就是JavaScript 装逼指南(js另类写法)的详细内容，更多关于js装逼写法的资料请关注好吧啦网其它相关文章！