這些JavaScript編程黑科技,高逼格代碼,讓你驚嘆不已
Javascript是一門(mén)很牛的語(yǔ)言,我可能學(xué)了假的JavaScript,哈哈!
1、單行寫(xiě)一個(gè)評(píng)級(jí)組件
"★★★★★☆☆☆☆☆".slice(5 - rate, 10 - rate);定義一個(gè)變量rate是1到5的值,然后執(zhí)行上面代碼,看圖
才發(fā)現(xiàn)插件什么的都弱爆了
2、如何裝逼用代碼罵別人SB
(!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!+[]]+({}+[])[[~!+[]]*~+[]]
了解為什么請(qǐng)移步:一行能裝逼的JavaScript代碼
3、如何用代碼優(yōu)雅的證明自己NB
這個(gè)牛逼了
console.log(([][[]]+[])[+!![]]+([]+{})[!+[]+!![]])
4、JavaScript 錯(cuò)誤處理的方式的正確姿勢(shì)
,舅服你
try {something} catch (e) { window.location.href ="//stackoverflow.com/search?q=[js]+" +e.message;}
5、從一行代碼里面學(xué)點(diǎn)JavaScript
[].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)}`)
接下來(lái)在瀏覽器控制看看:something magic happens
6、論如何優(yōu)雅的取隨機(jī)字符串
Math.random().toString(16).substring(2)Math.random().toString(36).substring(2)
7、(10)["toString"]() === "10"
解析請(qǐng)移步:js奇淫技巧1
8、匿名函數(shù)自執(zhí)行
這么多寫(xiě)法你選擇哪一種?我選擇死亡。
9、另外一種undefined
從來(lái)不需要聲明一個(gè)變量的值是undefined,因?yàn)镴avaScript會(huì)自動(dòng)把一個(gè)未賦值的變量置為undefined。所有如果你在代碼里這么寫(xiě),會(huì)被鄙視的
var data = undefined;
但是如果你就是強(qiáng)迫癥發(fā)作,一定要再聲明一個(gè)暫時(shí)沒(méi)有值的變量的時(shí)候賦上一個(gè)undefined。那你可以考慮這么做:
var data = void 0; // undefined
void在JavaScript中是一個(gè)操作符,對(duì)傳入的操作不執(zhí)行并且返回undefined。void后面可以跟()來(lái)用,例如void(0),看起來(lái)是不是很熟悉?沒(méi)錯(cuò),在HTML里阻止帶href的默認(rèn)點(diǎn)擊操作時(shí),都喜歡把href寫(xiě)成javascript:void(0),實(shí)際上也是依靠void操作不執(zhí)行的意思。
當(dāng)然,除了出于裝逼的原因外,實(shí)際用途上不太贊成使用void,因?yàn)関oid的出現(xiàn)是為了兼容早起ECMAScript標(biāo)準(zhǔn)中沒(méi)有undefined屬性。void 0的寫(xiě)法讓代碼晦澀難懂。
10、論如何優(yōu)雅的取整
var a = ~~2.33var b= 2.33 | 0var c= 2.33 >> 0
11、如何優(yōu)雅的實(shí)現(xiàn)金錢(qián)格式化:1234567890 --> 1,234,567,890
用正則魔法實(shí)現(xiàn):
非正則的優(yōu)雅實(shí)現(xiàn):
12、這個(gè)我服,還有這個(gè)你很機(jī)智
我服
while (1) { alert('牛逼你把我關(guān)了啊')}
你很機(jī)智,好一個(gè)障眼法
清除緩存: <a href="javascript:alert('清除成功');">清除緩存</a>
13、逗號(hào)運(yùn)算符
var a = 0;var b = ( a++, 99 );console.log(a); // 1console.log(b); // 99
14、論如何最佳的讓兩個(gè)整數(shù)交換數(shù)值
常規(guī)辦法:
var a=1,b=2;a += b;b = a - b;a -= b;
缺點(diǎn)也很明顯,整型數(shù)據(jù)溢出,對(duì)于32位字符最大表示數(shù)字是2147483647,如果是2147483645和2147483646交換就失敗了。
黑科技辦法:
a ^= b;b ^= a;a ^= b;
哈哈,看不懂的童鞋建議去補(bǔ)習(xí)一下C語(yǔ)言的位操作,我就不去復(fù)習(xí)了,以前學(xué)嵌入式時(shí)候?qū)W的位操作都忘了
15、實(shí)現(xiàn)標(biāo)準(zhǔn)JSON的深拷貝
var a = {a: 1,b: { c: 1, d: 2 }}var b=JSON.parse(JSON.stringify(a))
不考慮IE的情況下,標(biāo)準(zhǔn)JSON格式的對(duì)象蠻實(shí)用,不過(guò)對(duì)于undefined和function的會(huì)忽略掉。
16、不用Number、parseInt和parseFloat和方法把"1"字符串轉(zhuǎn)換成數(shù)字
哈哈,不準(zhǔn)用強(qiáng)制類(lèi)型轉(zhuǎn)換,那么就想到了強(qiáng)大了隱式轉(zhuǎn)換
var a =1 +a
17、如何裝逼的寫(xiě)出"hello world!"
滾動(dòng)條很長(zhǎng)哦
([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[+[]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+([][[]]+[])[+[]]+([][[]]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[!+[]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]])()([][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[!+[]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]])()(([]+{})[+[]])[+[]]+(!+[]+!![]+!![]+!![]+!![]+!![]+!![]+[])+(!+[]+!![]+!![]+!![]+!![]+!![]+!![]+[]))+([]+{})[+!![]]+(!![]+[])[+!![]]+(![]+[])[!+[]+!![]]+([][[]]+[])[!+[]+!![]]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+([][[]]+[])[+[]]+([][[]]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[!+[]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]])()([][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[!+[]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]])()(([]+{})[+[]])[+[]]+(!+[]+!![]+[])+(+!![]+[]))
居然能運(yùn)行,牛逼的隱式轉(zhuǎn)換
18、parseInt(0.0000008) === 8
19、++[[]][+[]]+[+[]] == 10
強(qiáng)大的隱式轉(zhuǎn)換,23333
20、0.1 + 0.2 == 0.3
0.1 +0.2 == 0.3 竟然是不成立的。。。。所以這就是為什么數(shù)據(jù)庫(kù)存儲(chǔ)對(duì)于貨幣的最小單位都是分。
簡(jiǎn)單說(shuō),0.1和0.2的二進(jìn)制浮點(diǎn)表示都不是精確的,所以相加后不是0.3,接近(不等于)
0.30000000000000004。
所以,比較數(shù)字時(shí),應(yīng)該有個(gè)寬容值。ES6中這個(gè)寬容值被預(yù)定義了:
Number.EPSILON
。
21、最短的代碼實(shí)現(xiàn)數(shù)組去重
[...new Set([1, "1", 2, 1, 1, 3])]
前不久面試阿里就問(wèn)了這道題,哈哈,所以也寫(xiě)上一下
22、用最短的代碼實(shí)現(xiàn)一個(gè)長(zhǎng)度為m(6)且值都n(8)的數(shù)組
Array(6).fill(8)
這個(gè)夠短了吧,好像是當(dāng)初哪里看到的一個(gè)面試題,就自己想到了ES6的一些API
23、短路表達(dá)式
條件判斷
var a = b && 1// 相當(dāng)于if (b) {a = 1} else {a = b}var a = b || 1// 相當(dāng)于if (b) {a = b} else {a = 1}
24、JavaScript版迷宮
逃出迷宮,2333
25、取出一個(gè)數(shù)組中的最大值和最小值
var numbers = [5, 458 , 120 , -215 , 228 , 400 , 122205, -85411];var maxInNumbers = Math.max.apply(Math, numbers);var minInNumbers = Math.min.apply(Math, numbers);
26、將argruments對(duì)象轉(zhuǎn)換成數(shù)組
var argArray = Array.prototype.slice.call(arguments);或者ES6:var argArray = Array.from(arguments)
27、javascript高逼格之Function構(gòu)造函數(shù)
很多JavaScript教程都告訴我們,不要直接用內(nèi)置對(duì)象的構(gòu)造函數(shù)來(lái)創(chuàng)建基本變量,例如var arr = new Array(2); 的寫(xiě)法就應(yīng)該用var arr = [1, 2];的寫(xiě)法來(lái)取代。
但是,F(xiàn)unction構(gòu)造函數(shù)(注意是大寫(xiě)的Function)有點(diǎn)特別。Function構(gòu)造函數(shù)接受的參數(shù)中,第一個(gè)是要傳入的參數(shù)名,第二個(gè)是函數(shù)內(nèi)的代碼(用字符串來(lái)表示)。
var f = new Function('a', 'alert(a)');f('jawil'); // 將會(huì)彈出窗口顯示jawil
這種方式可以根據(jù)傳入字符串內(nèi)容來(lái)創(chuàng)建一個(gè)函數(shù) 是不是高大上?!
28、從一個(gè)數(shù)組中找到一個(gè)數(shù),O(n)的算法,找不到就返回 null。
正常的版本:
function find (x, y) { for ( let i = 0; i < x.length; i++ ) { if ( x[i] == y ) return i;} return null;}let arr = [0,1,2,3,4,5]console.log(find(arr, 2))console.log(find(arr, 8))
結(jié)果到了函數(shù)式成了下面這個(gè)樣子(好像上面的那些代碼在下面若影若現(xiàn),不過(guò)又有點(diǎn)不太一樣,為了消掉if語(yǔ)言,讓其看上去更像一個(gè)表達(dá)式,動(dòng)用了 ? 號(hào)表達(dá)式):
//函數(shù)式的版本const find = ( f => f(f) ) ( f =>(next => (x, y, i = 0) =>( i >= x.length) ? null :( x[i] == y ) ? i :next(x, y, i+1))((...args) =>(f(f))(...args)))let arr = [0,1,2,3,4,5]console.log(find(arr, 2))console.log(find(arr, 8))