인프런 커뮤니티 질문&답변

function onRightClick(event) {
      event.preventDefault(); //도구모음 안나오게 
      const target = event.target; //이벤트 타겟은 내가 진짜 클릭한 대상. current target은 이벤트 리스너가 붙은 대상
      console.log(target) //왜 question이 나오는지
      const rowIndex = target.parentNode.rowIndex; //tr 태그에는 내부적으로 rowIndex 존재 
      const cellIndex = target.cellIndex;//td 태그에는 내부적으로 rowIndex 존재 
      const cellData = data[rowIndex][cellIndex];
      if (cellData === CODE.MINE) { // 지뢰면
        data[rowIndex][cellIndex] = CODE.QUESTION_MINE; // 물음표 지뢰로
        target.className = 'question';
        target.textContent = '?';
      } else if (cellData === CODE.QUESTION_MINE) { // 물음표 지뢰면
        data[rowIndex][cellIndex] = CODE.FLAG_MINE; // 깃발 지뢰로
        target.className = 'flag';
        target.textContent = '!';
      } else if (cellData === CODE.FLAG_MINE) { // 깃발 지뢰면
        data[rowIndex][cellIndex] = CODE.MINE; // 지뢰로
        target.className = '';
        target.textContent = '';
      } else if (cellData === CODE.NORMAL) { // 닫힌 칸이면
        data[rowIndex][cellIndex] = CODE.QUESTION; // 물음표로
        target.className = 'question';
        target.textContent = '?';
      } else if (cellData === CODE.QUESTION) { // 물음표면
        data[rowIndex][cellIndex] = CODE.FLAG; // 깃발으로
        target.className = 'flag';
        target.textContent = '!';
      } else if (cellData === CODE.FLAG) { // 깃발이면
        data[rowIndex][cellIndex] = CODE.NORMAL; // 닫힌 칸으로
        target.className = '';
        target.textContent = '';
      }

    }

우클릭을 했을 때 동작하는 함수입니다.
상단에 target에 대해서 console.log 출력하는 부분이 있는데

지뢰찾기 행수 열수 지뢰수를 입력하고 submit한 순간에는
td에 어떠한 클래스도 주어지지 않았다고 생각합니다.
그리고 최초로 우클릭을 하는 순간에도 td는 아무 클래스가 없고 우클릭이 이뤄지고 나서 그 다음 현재 cellData의 상황에 따라 target.className이 주어지니까

최초 클릭시에는
함수 상단 console.log(target)에 td class에는 아무것도 없어야한다 생각합니다. 그런데 왜 우클릭 시에 td class가 question으로 지정되어서 나오는지 이해가 안됩니다 ㅠㅠ