이 변수는 각 함수 호출과 정확히 어떻게 재설정되지 않습니까?

Question

메소드의 객체를 반환하는 간단한 모듈 패턴 함수를 만들었습니다.이 경우에는 a를 추가하는 하나의 메소드가 a 고유 ID가있는 div를 만든 다음 특정 섹션 요소에 추가합니다. id는 cardId라는 함수의 private 변수에서 만들어집니다. 변수가 각 함수 호출과 함께 1로 다시 설정되는 것을 이해하지 못하고 대신 함수에서 반환 된 모든 div에 cardId라는 다른 변수와 연관된 변수가 있음을 의미하는 고유 한 ID가 있습니다. 누군가가 이것에 대해 밝히거나 뭔가 저를 가리킬 수 있습니까?

let cardTools= function(){ 
    let cardId=1; 

    return { 
     addCard: function(){ 
     let card=document.createElement("div"); 
     let sec=document.getElementsByClassName("memory-cards")[0];//gets a section 

     card.classList.add("card"); 
     card.id="i"; 
     card.id+=cardId; 
     cardId+=1; 

     sec.appendChild(card); 

     return card; 
     } 
    } 
} 

let tools= cardTools(); 

let card=tools.addCard(); //id==i1 
let card2=tools.addCard(); //id==i2 
let card3=tools.addCard(); //id==i3 

Answer 1

먼저 질문을 드리겠습니다. 이 코드가 작동하는지 확인 하시겠습니까?

작동하려면 다음을 수행해야했습니다.

let card1 = cardTools().addCard(); 
console.log(card1.id); 

이렇게하면 각 호출에서 i1을 볼 수있었습니다. 여기에 게시 한 코드 스 니펫에서 구문 오류가 발생했습니다.

업데이트 : 죄송합니다. 코드를 올바르게 읽지 않았습니다. 나는 당신의 코드가 작동하고 있다고 확신한다. 그러나, 내가 이것을했을 때, 나는 각각의 경우에 i1을 얻었다.