贊同數超過10k再點贊會變成NaN?

在TL中看到了一個贊同數10K的回答,點了個贊,贊同數就成了NaN

然後又到笑忘書的 一萬票回答 的收藏夾中試了一下,發現會先變成NaN然後立即變成贊同數。

用的是Firefox 33.1,對前端不熟,沒分析是什麼原因導致的

-------------------

看了一下匿名用戶的回答明白了。

感覺這麼做的原因是為了防止點贊後如果網路不好好長時間也沒看到贊同數增加導致用戶體驗過差?建議知乎應該判斷下如果原來的贊同數就是NaN或者超過10k就不要增加了,直接等ajax返回真正的贊同數值就好了。。

另外吐槽一句js這種動態弱類型的語言確實挺蛋疼啊


點贊按鈕裡邊是這樣的:

而當點贊數特別大時,裡邊是這樣的:

在js里,操作一個整數或整數格式的字元串的自增,會讓它+1,但如果是一個不符合整數格式的字元串直接自增,就會變成NaN

如上圖,假設拿到了count節點,那麼:

count.innerHTML=++count.innerHTML;

第一張圖,"25"++就強制類型轉換變成了26;

但第二張圖,字元串"35 k"++強制類型轉換會變成NaN,這是一個number類型的值,專用來表示無法區分字元和數字的類型:

ECMAScript Language Specification (ECMA-262 5th Edition)

如圖中解釋,"35 k"因為多了一個k,變成了不是一個StringNumericLiteral,於是在內部強制ToNumber時就變成了NaN。

而變一下又變回來是因為內部流程順序是這樣的:

1,點擊贊同;

2,前端先取count.innerHTML++,再填回去;此時變成了NaN;

3,同時向後端發一次aj請求,獲取真實的贊同數(因為從你打開頁面到你點贊的時間內,可能還有其他人也點了贊,所以第二步的數字不一定正確)

4,請求返回真實的數字後,填回去

而3到4的請求是需要間隔的,所以會看到先變成NaN然後又變正確了


跟js有毛關係,知乎的前端太水好不好。。。


推薦閱讀:

到底什麼是前端、後端、後台啊?
自學前端之路應該往簡歷上添加什麼項目增加競爭力?
是什麼讓你在前端行業堅持下去,或者什麼讓你發現你是真的熱愛它?
如何評價hax(賀老)的《前端們,賀老 Live 面試你了!》live ?
2017年前端前景如何?

TAG:前端開發 | 知乎Bug反饋 |