這些JavaScript編程黑科技,裝逼指南,高逼格代碼,讓你驚歎不已

Javascript是一門很吊的語言,我可能學了假的JavaScript,哈哈,你們還有什麼推薦的,補充送那啥邀請碼。javascript

本文秉承着:你看不懂是你SB,我寫的代碼就要牛逼。html

一、單行寫一個評級組件

"★★★★★☆☆☆☆☆".slice(5 - rate, 10 - rate);定義一個變量rate是1到5的值,而後執行上面代碼,看圖java

才發現插件什麼的都弱爆了git

二、如何裝逼用代碼罵別人SB

(!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!+[]]+({}+[])[[~!+[]]*~+[]]



瞭解爲何請移步:一行能裝逼的JavaScript代碼github

三、如何用代碼優雅的證實本身NB

這個牛逼了面試

console.log(([][[]]+[])[+!![]]+([]+{})[!+[]+!![]])

四、JavaScript 錯誤處理的方式的正確姿式

???,舅服你算法

try {
    something
} catch (e) {
    window.location.href =
        "http://stackoverflow.com/search?q=[js]+" +
        e.message;
}

五、從一行代碼裏面學點JavaScript

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

翻譯成正常語言就是這樣的shell

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

接下來在瀏覽器控制看看:something magic happens數據庫



具體分析請參見這篇文章:從一行代碼裏面學點JavaScript數組

六、論如何優雅的取隨機字符串

Math.random().toString(16).substring(2) // 13位
Math.random().toString(36).substring(2) // 11位

七、(10)["toString"]() === "10"


解析請移步:js奇淫技巧1

八、匿名函數自執行

這麼多寫法你選擇哪種?我選擇死亡。

( function() {}() );
( function() {} )();
[ function() {}() ];

~ function() {}();
! function() {}();
+ function() {}();
- function() {}();

delete function() {}();
typeof function() {}();
void function() {}();
new function() {}();
new function() {};

var f = function() {}();

1, function() {}();
1 ^ function() {}();
1 > function() {}();
// ...

九、另一種undefined

歷來不須要聲明一個變量的值是undefined,由於JavaScript會自動把一個未賦值的變量置爲undefined。全部若是你在代碼裏這麼寫,會被鄙視的

var data = undefined;

可是若是你就是強迫症發做,必定要再聲明一個暫時沒有值的變量的時候賦上一個undefined。那你能夠考慮這麼作:

var data = void 0; // undefined

void在JavaScript中是一個操做符,對傳入的操做不執行而且返回undefined。void後面能夠跟()來用,例如void(0),看起來是否是很熟悉?沒錯,在HTML裏阻止帶href的默認點擊操做時,都喜歡把href寫成javascript:void(0),實際上也是依靠void操做不執行的意思。

固然,除了出於裝逼的緣由外,實際用途上不太同意使用void,由於void的出現是爲了兼容早起ECMAScript標準中沒有undefined屬性。void 0的寫法讓代碼晦澀難懂。

十、論如何優雅的取整

var a = ~~2.33

var b= 2.33 | 0

var c= 2.33 >> 0

十一、如何優雅的實現金錢格式化:1234567890 --> 1,234,567,890

用正則魔法實現:

var test1 = '1234567890'
var format = test1.replace(/\B(?=(\d{3})+(?!\d))/g, ',')

console.log(format) // 1,234,567,890

非正則的優雅實現:

function formatCash(str) {
       return str.split('').reverse().reduce((prev, next, index) => {
            return ((index % 3) ? next : (next + ',')) + prev
       })
}
console.log(formatCash('1234567890')) // 1,234,567,890

十二、這個我服,還有這個你很機智

我服

while (1) {
    alert('牛逼你把我關了啊')
}

你很機智,好一個障眼法

清除緩存: <a href="javascript:alert('清除成功');">清除緩存</a>

1三、逗號運算符

var a = 0; 
var b = ( a++, 99 ); 
console.log(a);  // 1
console.log(b);  // 99

1四、論如何最佳的讓兩個整數交換數值

常規辦法:

var a=1,b=2;
a += b;
b = a - b;
a -= b;

缺點也很明顯,整型數據溢出,對於32位字符最大表示數字是2147483647,若是是2147483645和2147483646交換就失敗了。
黑科技辦法:

a ^= b;
b ^= a;
a ^= b;

哈哈?,看不懂的童鞋建議去補習一下C語言的位操做,我就不去複習了,之前學嵌入式時候學的位操做都忘了

1五、實現標準JSON的深拷貝

var a = {
    a: 1,
    b: { c: 1, d: 2 }
}
var b=JSON.parse(JSON.stringify(a))

不考慮IE的狀況下,標準JSON格式的對象蠻實用,不過對於undefined和function的會忽略掉。

1六、不用Number、parseInt和parseFloat和方法把"1"字符串轉換成數字

哈哈,不許用強制類型轉換,那麼就想到了強大了隱式轉換

var a =1 
+a

1七、如何裝逼的寫出"hello world!"

滾動條很長哦?

([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[+[]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+([][[]]+[])[+[]]+([][[]]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[!+[]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]])()([][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[!+[]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]])()(([]+{})[+[]])[+[]]+(!+[]+!![]+!![]+!![]+!![]+!![]+!![]+[])+(!+[]+!![]+!![]+!![]+!![]+!![]+!![]+[]))+([]+{})[+!![]]+(!![]+[])[+!![]]+(![]+[])[!+[]+!![]]+([][[]]+[])[!+[]+!![]]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+([][[]]+[])[+[]]+([][[]]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[!+[]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]])()([][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(![]+[])[!+[]+!![]+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+([]+[][(![]+[])[!+[]+!![]+!![]]+([]+{})[+!![]]+(!![]+[])[+!![]]+(!![]+[])[+[]]][([]+{})[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]]+(![]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+[]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(!![]+[])[+[]]+([]+{})[+!![]]+(!![]+[])[+!![]]]((!![]+[])[+!![]]+([][[]]+[])[!+[]+!![]+!![]]+(!![]+[])[+[]]+([][[]]+[])[+[]]+(!![]+[])[+!![]]+([][[]]+[])[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]+!![]+!![]]+(![]+[])[!+[]+!![]]+([]+{})[+!![]]+([]+{})[!+[]+!![]+!![]+!![]+!![]]+(+{}+[])[+!![]]+(!![]+[])[+[]]+([][[]]+[])[!+[]+!![]+!![]+!![]+!![]]+([]+{})[+!![]]+([][[]]+[])[+!![]])())[!+[]+!![]+!![]]+([][[]]+[])[!+[]+!![]+!![]])()(([]+{})[+[]])[+[]]+(!+[]+!![]+[])+(+!![]+[]))

竟然能運行,牛逼的隱式轉換

1八、parseInt(0.0000008) === 8

1九、++[[]][+[]]+[+[]] == 10

強大的隱式轉換,23333

20、0.1 + 0.2 == 0.3

0.1 +0.2 == 0.3 居然是不成立的。。。。因此這就是爲何數據庫存儲對於貨幣的最小單位都是分。

簡單說,0.10.2的二進制浮點表示都不是精確的,因此相加後不是0.3,接近(不等於)
0.30000000000000004

因此,比較數字時,應該有個寬容值。ES6中這個寬容值被預約義了:Number.EPSILON

2一、最短的代碼實現數組去重

[...new Set([1, "1", 2, 1, 1, 3])]

前不久面試阿里就問了這道題,哈哈,因此也寫上一下

2二、用最短的代碼實現一個長度爲m(6)且值都n(8)的數組

Array(6).fill(8)

這個夠短了吧,好像是當初哪裏看到的一個面試題,就本身想到了ES6的一些API

2三、短路表達式

條件判斷

var a = b && 1
    // 至關於
if (b) {
    a = 1
} else {
    a = b
}

var a = b || 1
    // 至關於
if (b) {
    a = b
} else {
    a = 1
}

2四、JavaScript版迷宮


逃出迷宮,2333

2五、取出一個數組中的最大值和最小值

var numbers = [5, 458 , 120 , -215 , 228 , 400 , 122205, -85411]; 
var maxInNumbers = Math.max.apply(Math, numbers); 
var minInNumbers = Math.min.apply(Math, numbers);

2六、將argruments對象轉換成數組

var argArray = Array.prototype.slice.call(arguments);

或者ES6:

var argArray = Array.from(arguments)

2七、javascript高逼格之Function構造函數

不少JavaScript教程都告訴咱們,不要直接用內置對象的構造函數來建立基本變量,例如var arr = new Array(2); 的寫法就應該用var arr = [1, 2];的寫法來取代。

可是,Function構造函數(注意是大寫的Function)有點特別。Function構造函數接受的參數中,第一個是要傳入的參數名,第二個是函數內的代碼(用字符串來表示)。

var f = new Function('a', 'alert(a)');
f('jawil'); // 將會彈出窗口顯示jawil

這種方式能夠根據傳入字符串內容來建立一個函數 是否是高大上?!

2八、從一個數組中找到一個數,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))

結果到了函數式成了下面這個樣子(好像上面的那些代碼在下面若影若現,不過又有點不太同樣,爲了消掉if語言,讓其看上去更像一個表達式,動用了 ? 號表達式):

//函數式的版本
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))

如何讀懂並寫出裝逼的函數式代碼

最後奉勸你們一句:莫裝逼、白了少年頭,2333。。。原文收錄在個人 GitHub博客 ( https://github.com/jawil/blog ) ,喜歡的能夠關注最新動態,你們一塊兒多交流學習,共同進步,以學習者的身份寫博客,記錄點滴。

相關文章
相關標籤/搜索
本站公眾號
   歡迎關注本站公眾號,獲取更多信息