JavaScript中的運算操作陷阱

最近做JSP大作業，需要寫一個網站，其中用到了分頁系統，就自己擼了一個。

其中的翻頁邏輯是這樣寫的：

/*上一頁*/
previousPage.click(function(){ 
    clickPage(grids[currentActivePos].find('a').html() - 1);
});
/*下一頁*/
nextPage.click(function() { 
    clickPage(grids[currentActivePos].find('a').html() + 1);
});

扔到網頁裏實驗，發現[上一頁]功能沒有問題，但是點擊[下一頁]之後沒有反應，下邊還有一個類似的錯誤：

grids[i].find('a').html(index + i - 3);

當測試時，index是從.html()方法獲取的字面值爲3的參數，i是循環控制變量，當i也是3時，出現了gridsp[i]的值變成30而不是3的情況。

一直想不明白這奇怪的現象是因爲什麼，但問題肯定就出在這句話上，所以就試着把表達式的順序變了一下，像這樣：

grids[i].find('a').html(i - 3 + index);

發現結果變成了03，到這裏才明白這結果不是數值而是字符串！也就是index是string類型的，直接用數字和它進行+操作結果不是進行數值運算而是字符串連接！

因而也明白了翻頁邏輯的錯誤在哪裏。改動如下：

/*上一頁*/
previousPage.click(function(){
    clickPage(grids[currentActivePos].find('a').html() - 1);
});
/*下一頁*/
nextPage.click(function() { 
    var des = eval(grids[currentActivePos].find('a').html() + '+ i');
    clickPage(des);
});

/*先進行減法運算，把表達式結果轉換成數值類型*/
grids[i].find('a').html(index - 3 + i);

---

總結：非常傻的一個錯誤，找到原因之後覺得自己非常基礎的東西沒有掌握牢固。這一段時間雖然涉及的面不少，但是都沒有什麼深入，這樣就有點像”非科班”的CS學生了，應該警醒。