글로벌 변수를 사용하지 않기 위해이 Javascript를 어떻게 바꿀 수 있습니까?

Question

프로그램 흐름을 제어하고 내 웹 앱에서 자바 스크립트로 전역 변수를 사용하지 않는 방법을 알아 내는데 어려움을 겪고 있습니다. 이 예에서 get_notes()이 호출되면 수신 노트의 ID는 current_note_ids 배열에 저장됩니다. add_to_discussion()이 호출되면 current_note_ids이 매개 변수로 서버 요청에 전송됩니다. current_note_ids을 전역 변수로 사용하지 않고이 작업을 수행하려면 어떻게해야합니까?

<script type="text/javascript"> 
    var current_note_ids = []; 

    function add_to_discussion(){ 
     $.post('/add_to_discussion',{current_note_ids:current_note_ids}); 
    } 

    function get_notes(){ 
     $.post('/get_note_combination',{}, function(data) {    
      current_note_ids = []; // clear existing note details 
      for (i in data.notes) { 
       current_note_ids.push(data.notes[i].guid); 
      } 
     } 
    } 

    $(document).ready(function() { 

     $('#add_to_discussion_button').click(function(){ 
      add_to_discussion(); 
      return false; 
     }); 

     $('#get_notes_link').click(function(){ 
      get_notes(); 
      return false; 
     }); 

    }); 

</script> 

Answer 1

이것은 closure

(function() { 

    var current_note_ids = []; 

    function add_to_discussion(){ 
     $.post('/add_to_discussion',{current_note_ids:current_note_ids}); 
    } 

    function get_notes(){ 
     $.post('/get_note_combination',{}, function(data) {    
      current_note_ids = []; // clear existing note details 
      for (i in data.notes) { 
       current_note_ids.push(data.notes[i].guid); 
      } 
     } 
    } 

    $(document).ready(function() { 

     $('#add_to_discussion_button').click(function(){ 
      add_to_discussion(); 
      return false; 
     }); 

     $('#get_notes_link').click(function(){ 
      get_notes(); 
      return false; 
     }); 

    }); 

})(); 

Answer 2

당신은이 OO 같은 수 있도록 익명 함수를 사용하여 전역에서 모든 코드를 제거합니다. 이 경우 "노출"할 항목을 선택할 수 있습니다.

var notes = $(function() { 
    var current_note_ids = []; 

    function add_to_discussion() { 
     $.post('/add_to_discussion', { 
      current_note_ids: current_note_ids 
     }); 
    } 

    function get_notes() { 
     $.post('/get_note_combination', {}, function(data) { 
      current_note_ids = []; // clear existing note details 
      for (i in data.notes) { 
       current_note_ids.push(data.notes[i].guid); 
      } 
     }) 
    } 
    return { 
     add_to_discussion: add_to_discussion, 
     get_notes: get_notes 
    }; 
})(); 

$(document).ready(function() { 

    $('#add_to_discussion_button').click(function() { 
     notes.add_to_discussion(); 
     return false; 
    }); 

    $('#get_notes_link').click(function() { 
     notes.get_notes(); 
     return false; 
    }); 

});