2013-05-02 2 views
0

이 JavaScript 코드가이 재미있는 결과를 생성하는 이유는 무엇입니까? RowID와 CellID를보십시오.JavaScript 폐쇄 프로그래밍의 정적 변수의 이상한 동작

Result: 
[R0C0]: Apple [R1C1]: 400 
[R2C0]: Google [R3C1]: 700 


    <html> 
    <head> 
     <script src="ClosureAccessStaticVariable.js" type="text/javascript"></script> 
     <script src="jquery-1.9.1.js" type="text/javascript"></script> 
    </head> 
    <body> 
     <div id="panelTable"></div> 
     <script> 
     function Table(dataRows){ 
     var rows = []; 
     this.GetTable = function(){ 
      var table = $("<table>"); 
      $(rows).each(function(){ 
       table.append(this.GetRow()); 
      }); 
      return table; 
     } 
     function init(){ 
      $(dataRows).each(function(index){ 
       rows[index] = new TableRow(this); 
      }); 
     } 
     function TableRow(rowData){ 
      var cells = []; 
      this.GetRow = function(){ 
       var row = $("<tr>"); 
       $(cells).each(function(){ 
        row.append(this.GetCell()); 
       }); 
       return row; 
      } 
      function init(){ 
       var i=0; 
       for(var cellName in rowData){ 
        cells[i] = new TableCell(rowData[cellName]); 
        i++; 
       } 
      } 
      function TableCell(text){ 
       this.GetCell = function(){ 
        if(TableRow.ID == undefined) 
         TableRow.ID = 0; 
        if(TableCell.ID == undefined) 
         TableCell.ID = 0; 

        var rowId = TableRow.ID; 
        var cellId = TableCell.ID; 
        TableRow.ID = TableRow.ID + 1; 
        TableCell.ID = TableCell.ID + 1; 
        return $("<td style='border:1px solid lightgray;padding:2px;'>").html("[R"+rowId+"C"+cellId+"]: "+text); 
       } 
      } 
      init(); 
     } 
     init(); 
     } 
     var data = [ { Name: "Apple", Value: 400}, {Name: "Google", Value: 700}]; 
     var table = new Table(data); 
     var tableDom = table.GetTable(); 
     $("#panelTable").append(tableDom); 
    </script> 
    </body> 
    </html> 
+0

당신이 jsFiddle이를 할 수 있나요? 코드 벽은 디버깅이 재미 있지 않습니다. ClosureAccessStaticVariable.js에 무엇이 있는지 추측 할 수 있습니까 ?? – frenchie

+0

왜 결과가 재미 있다고 생각하십니까? 그 밖의 무엇을 기대 했습니까? – Bergi

+0

Frenchie : ClosureAccessStaticVariable.js의 내용은이 코드입니다. html 페이지로 만들면 .html 파일로 실행할 수 있습니다. –

답변

0
당신은 모든 세포에 행을 증가하고

:

this.GetCell = function(){ 
    var rowId = TableRow.ID; 
    var cellId = TableCell.ID; 
    // The row ID gets updated 
    TableRow.ID = TableRow.ID + 1; 
    TableCell.ID = TableCell.ID + 1; 
+0

행 ID를 사용 중입니다. Cell ID를 보면 셀 ID가 매번 증가합니다. 아마도 정적 변수가 그 클래스에 속해있을 것입니다. 내가 얻으려고 노력하는 대답은 셀 ID가 증가하지 않았고 두 번째 행에 대해 재설정 된 이유입니다. 내가 생각할 수있는 한 가지 주된 이유는 두 개의 TableRows 객체를 생성했기 때문입니다. TableCell 클래스가 다시 만들어지기 때문입니다. –