重新學習JavaScript

因為1997年看過一點第一代的JavaScript，到2000年時就大幅度改寫，於是我一直很討厭學JavaScript。

最近因為被主管要求寫一個具有AJAX效果的網頁，所以再拿出jQuery in Action來看，書沒看完就寫code果然犯了兩個嚴重錯誤。



第一個錯誤就是因為bind事件因closure造成的memory leak。。在jQuery in Action的附錄有寫closure和memory leak，在 重新介紹JavaScript裏也有寫以下範例：

function addHandler() {
    var el = document.getElementById('el');
    el.onclick = function() {
        this.style.backgroundColor = 'red';
    }
}

要加上e1=null; 才不會memory leak

function addHandler() {
    var el = document.getElementById('el');
    el.onclick = function() {
        this.style.backgroundColor = 'red';
    }
    e1 = null;
}

第二個錯誤則是知道memory leak後在所有function底下把變數加上 xxx=null的宣告。這樣有什麼問題呢？一般的function不會有什麼問題，但我用了jQuery的$.ajax，非同步的宣告使得success的function比較晚執行，傳進去的closure變數已經被清空，所以原本可以執行的程式又變成不能執行。若要釋放變數應該要放在success區段的最底下。

function fail2() {
   var param = $("#somewhere").val();
   $.ajax({
        url: "test.php",
       dataType: "text",
       success: function(ret) {
          // 以下用到 closure的變數 param
         var xyz=param+ret; 
         // do something
       }
   });
   param = null; //在這裏釋放就錯了
}

要改成

function fail2() {
   var param = $("#somewhere").val();
   $.ajax({
        url: "test.php",
       dataType: "text",
       success: function(ret) {
          // 以下用到 closure的變數 param
         var xyz=param+ret; 
          // do something
         param = null; //在這裏釋放才對
       }
   });
}

只能說當掉重修呀.... Orz