下面就是具體的寫法，建議大家逐個(gè)測(cè)試一下，加深印象

這個(gè)較為常用。

!!’a’//true

通過兩個(gè)取反，可以強(qiáng)制轉(zhuǎn)換為Boolean類型。

!!是將表達(dá)式強(qiáng)制轉(zhuǎn)化為bool值的運(yùn)算，運(yùn)算結(jié)果為true或false，表達(dá)式是什么值，結(jié)果就是對(duì)應(yīng)的bool值，不再取非。

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

!!false=false; 要注意false和“false” 的區(qū)別！！！！！

!!'false'=true;

!!true=true;

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

String轉(zhuǎn)化為Number；日期輸出時(shí)間戳。

+’45’//45 +new Date//13位時(shí)間戳

會(huì)自動(dòng)轉(zhuǎn)化為Number類型的。日期取時(shí)間戳不用new Date().getTime()。

parseInt這個(gè)函數(shù)太普通了，怎么能裝逼。答案是~~，這種方法還可以將字符串轉(zhuǎn)換成數(shù)字類型。向下取整。

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

原理是~是一個(gè)叫做按位非的操作，會(huì)返回?cái)?shù)值的反碼，兩次取反就是原數(shù)。|為位運(yùn)算符，兩個(gè)位只要有一個(gè)為1，那么結(jié)果都為1，否則就為0。>>運(yùn)算符執(zhí)行有符號(hào)右移位運(yùn)算。都是二進(jìn)制操作。 原因在于JavaScript中的number都是double類型的，在位操作的時(shí)候要轉(zhuǎn)化成int。

十六進(jìn)制操作。其實(shí)就是一個(gè)Array.prototype.toString(16)的用法看到這個(gè)詞腦袋里冒出的肯定是CSS的顏色。

做到隨機(jī)的話可以這樣

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

底下的原文鏈接非常建議去讀一下，后三個(gè)技巧都是在那里學(xué)到的。«左移操作。這個(gè)操作特別叼。一般得玩 C 玩得多的，這個(gè)操作會(huì)懂一些。一般半路出家的前端碼農(nóng)可能不太了解(說的是我 ☹)。這個(gè)也是二進(jìn)制操作。將數(shù)值二進(jìn)制左移解釋上面的1<<24的操作。其實(shí)是1左移24位。000000000000000000000001左移24位，變成了1000000000000000000000000不信？試著在console粘貼下面的代碼

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

其實(shí)還有一種更容易理解的方法來解釋

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

因?yàn)槭嵌M(jìn)制操作，所以速度是很快的。

反面示例：

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

用 || 和 &&來簡(jiǎn)化if-else 。有時(shí)候用 !! 操作符也能簡(jiǎn)化if-else模式。例如這樣：

let a = b || 1;//b為真，a=b;b為假，a=1; let c = b && 1;//b為真，c=1;b為假，c=b; // 使用!!符號(hào) let isValid = !!(value && value !== ’error’);

“!”是取反操作，兩個(gè)“!”自然是負(fù)負(fù)得正了。比較常用的是||。

另外一種undefined

let data = void 0; // undefined

void 運(yùn)算符 對(duì)給定的表達(dá)式進(jìn)行求值，然后返回 undefined。那為什么要用void 0，不直接undefined呢？ undefined在javascript中不是保留字。因此在IE5.5~8中我們可以將其當(dāng)作變量那樣對(duì)其賦值（IE9+及其他現(xiàn)代瀏覽器中賦值給undefined將無效）。采用void方式獲取undefined更準(zhǔn)確。

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

注意， toFixed() 方法返回的是字符串而不是一個(gè)數(shù)字。

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

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

//正則 let cash = ’1234567890’ cash.replace(/B(?=(d{3})+(?!d))/g, ’,’);//'1,234,567,890' //非正則的優(yōu)雅實(shí)現(xiàn) function formatCash(str) { return str.split(’’).reverse().reduce((prev, next, index) => { return ((index % 3) ? next : (next + ’,’)) + prev }) } formatCash(cash);//'1,234,567,890'

非正則的方法，先把字符串轉(zhuǎn)成了數(shù)組，反轉(zhuǎn)了一下變成了[0,9,8,7,6,5,4,3,2,1]。再對(duì)新的數(shù)組進(jìn)行reduce操作，數(shù)組元素位置除3取余，是3的倍數(shù)的位置就增加’,’，最后返回累加的字符串。

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

不考慮IE的情況下，標(biāo)準(zhǔn)JSON格式的對(duì)象蠻實(shí)用，不過對(duì)于undefined和function的會(huì)忽略掉。

阿里面試官，喜歡問這個(gè)問題。

let array=[1, '1', 2, 1, 1, 3]; //拓展運(yùn)算符(...)內(nèi)部使用for...of循環(huán) [...new Set(array)];//[1, '1', 2, 3] //利用Array.from將Set結(jié)構(gòu)轉(zhuǎn)換成數(shù)組 Array.from(new Set(array));//[1, '1', 2, 3]

傳統(tǒng)的方法，循環(huán)遍歷：排序sort()后前一下與后一個(gè)比較==；在數(shù)組中用indexOf判斷，利用includes，利用filter；這些方法感覺都過時(shí)了，還是用ES6中利用Set去重比較牛。

Math.max方法可以求出給定參數(shù)中最大的數(shù)。

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

但如果是數(shù)組，就不能這樣調(diào)用了。此時(shí)就用到了apply方法。Function.apply()是JS的一個(gè)OOP特性，一般用來模擬繼承和擴(kuò)展this的用途。所有函數(shù)都有apply(作用域鏈,參數(shù))這個(gè)方法，當(dāng)作用域鏈為null時(shí)，默認(rèn)為上文，這個(gè)函數(shù)的“參數(shù)”，接收一個(gè)數(shù)組。

let arr = [’1’,’2’,’3.1’,’3.2’,0,-1]; //用apply方法 Math.max.apply(null, arr);//3.2 Math.min.apply(Math, arr);//-1 //用拓展運(yùn)算符 Math.max(...arr);//3.2 Math.min(...arr);//-1IIFE

這個(gè)其實(shí)非常有實(shí)用價(jià)值，不算是裝逼。只是其他語(yǔ)言里沒有這么玩的，給不太了解js的同學(xué)看那可牛逼大了。

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

實(shí)用價(jià)值在于可以防止全局污染。不過現(xiàn)在隨著ES2015的普及已經(jīng)沒什么必要用這個(gè)了，我相信五年之后，這種寫法就會(huì)逐漸沒落。

自己干五年，在實(shí)習(xí)生面前裝逼用也是蠻不錯(cuò)的嘛~

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

翻譯成正常語(yǔ)言就是這樣的

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

事件響應(yīng)前端肯定都寫爛了，一般來說如何寫一個(gè)計(jì)數(shù)器呢？

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

好像是沒什么問題哦，但是！變量times為什么放在外面，就用了一次放在外面，命名沖突了怎么辦，或者萬一在外面修改了怎么辦。

這個(gè)時(shí)候這樣一個(gè)事件監(jiān)聽代碼就比較牛逼了

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

怎么樣，是不是立刻感覺不一樣了。瞬間逼格高了起來！

通過創(chuàng)建一個(gè)閉包，把times封裝到里面，然后返回函數(shù)。這個(gè)用法不太常見。

以上就是JavaScript 裝逼指南(js另類寫法)的詳細(xì)內(nèi)容，更多關(guān)于js裝逼寫法的資料請(qǐng)關(guān)注好吧啦網(wǎng)其它相關(guān)文章！