• 카테고리

    질문 & 답변
  • 세부 분야

    프로그래밍 언어

  • 해결 여부

    해결됨

틱택토 코드에서 ESLint Warning

24.01.02 00:33 작성 24.01.02 00:40 수정 조회수 201

0

안녕하세요 제로초님
틱택토 2강 중에 클릭 이벤트 부분 진행 중 질문 드립니다

저는 https://playcode.io/ 라는 온라인 에디터에서 공부 중인데요 여기 환경에서 ESLint Warning 이 떠서 문의드립니다.

const elemTable = document.createElement('table');
let turn = 'O';
for (let i = 0; i < 3; i++) {
  const elemTr = document.createElement('tr');
  for (let i = 0; i < 3; i++) {
    const elemTd = document.createElement('td');
    elemTd.addEventListener('click', (e) => { // ESLint Warning
      if (e.currentTarget.textContent) return; // ESLint Warning
      e.currentTarget.textContent = turn; // ESLint Warning
      turn === 'O' ? turn = 'X' : turn = 'O'; // ESLint Warning
    }) // ESLint Warning
    elemTr.insertAdjacentElement('beforeend', elemTd);
  }
  elemTable.insertAdjacentElement('beforeend', elemTr);
}
document.body.insertAdjacentElement('afterbegin', elemTable);

'Function declared in a loop contains unsafe references to variable'
-> 루프에서 선언된 함수에 변수에 대한 안전하지 않은 참조가 포함된다.

라는 내용이라고 하는데 위 내용을 구글링 해보면 반복분 for에서 var 대신 let은 쓰면 해결된다는 내용뿐이라(이미 let 사용중) 어떤 부분이 원인인지 잘 모르겠어서요. 코드는 잘 실행됩니다

저는 삼항연산자를 썼지만 강의 내용대로 if문을 써도 동일한 ESLint Warning이 나오고 있습니다.

배포된 페이지도 공유드립니다.
https://1710512.playcode.io/

답변 2

·

답변을 작성해보세요.

1

warning은 아무 문제가 아닙니다. 그냥 무시하셔도 됩니다. 저건 비동기코드+반복문에서 일어날 수 있는 문제를 가리키는 거긴 한데, 가능성일 뿐이지 실제로 일어나진 않습니다.

루룸님의 프로필

루룸

질문자

2024.01.02

늦은 시간에도 답변주셔셔 감사합니다~!

0

인프런 AI 인턴님의 프로필

인프런 AI 인턴

2024.01.02

안녕하세요, 인프런 AI 인턴입니다.

해당 질문에 대한 답변은 강사님께서 다른 수강생의 유사한 질문에 답변을 하신 내용이 있어서 그 링크를 안내해 드리겠습니다. 강사님의 답변에 따르면, 이러한 ESLint 경고는 루프 내에서 함수를 선언할 때 변수에 대한 참조가 안전하지 않을 수 있다는 것을 나타내는데, 이 경우 let을 사용하는 것으로 해결할 수 있다고 합니다. 구체적인 해결 방법이나 더 자세한 내용은 아래 링크를 통해 확인하실 수 있습니다.

강의를 진행하시면서 궁금한 점이 생기시면 언제든지 질문해 주세요.