送給產品經理一段代碼 讓他放到 console 去
(!(~+[]) + {})[--[~+""][+[]] * [~+[]] + ~~!+[]] + ({} + [])[[~!+[]] * ~+[]]
其實這段代碼是我的同事發給我的, 我定睛一看一定有坑, 於是準備破解一番
其實這裡面涉及到的知識點無非三個
數據類型的轉換
位運算(按位非)
運算符的優先級
分析之前我推薦大家看幾篇文章
數據類型轉換: 自動轉換
按位操作符: ~(按位非)
運算符優先級
首先我們把代碼進行拆分
(!(~+[]) + {})[--[~+""][+[]] * [~+[]] + ~~!+[]] + ({} + [])[[~!+[]] * ~+[]]簡單來看就是 (A)[B] + (C)[D]
首先來看 A !(~+[]) + {}
+[] -(數據類型轉換)-> 0 ~+[] --> ~0 -(位運算)-> -1 !(~+[]) --> !(-1) -(類型轉換)-> false (!(~+[]) + {}) --> false + {} -(類型轉換)-> 'false[object Object]'再來看 B --[~+""][+[]]*[~+[]] + ~~!+[]
[~+""] --> [~0] --> [-1] +[] --> 0 --[~+""][+[]] --> --[-1][0] --> --(-1) --> -2 [~+[]] --> [~0] --> [-1] ~~!+[] --> ~~!0 --> ~~true --> ~-2 -> 1 B --> -2 * [-1] + 1 --> 2 + 1 --> 3
那麼 (A)[B] --> 'false[object Object]'[3] --> 's'
再來看 C ({} + [])
這裡的 {} 其實是個代碼塊
所以等價於 +[] 即 [object Object]
再來看 D [~!+[]] * ~+[]
[~!+[]] --> [~!0] --> [!1] --> -2 ~+[] --> ~0 --> -1 D -> -2 * -1 --> 2
所以 (C)[D] --> '[object Object]'[2] --> 'b'
那麼
(!(~+[]) + {})[--[~+""][+[]] * [~+[]] + ~~!+[]] + ({} + [])[[~!+[]] * ~+[]] --> (A)[B] + (C)[D) --> 's' + 'b' --> 'sb'謝謝觀看
現在可以發給產品經理了
讓他打開 chrome, (windows: F12, mac: command+option+(j or i))
粘貼 (!(~+[])+{})[--[~+""][+[]]*[~+[]] + ~~!+[]]+({}+[])[[~!+[]]*~+[]]
這就是我們前端一直想對你說的話
鏈接：https://juejin.im/post/5a7d19d9f265da4e9673e809
分享到:
閱讀更多 前端圈 的文章
