🤍 전 강의 25% 할인 중 🤍

2024년 상반기를 돌아보고 하반기에도 함께 성장해요!
인프런이 준비한 25% 할인 받으러 가기 >>

  • 카테고리

    질문 & 답변
  • 세부 분야

    프로그래밍 언어

  • 해결 여부

    미해결

9-5강 승부 판단하기 부분 문의드립니다.

21.08.29 13:12 작성 조회수 109

0

const checkWinner = (target) => { let rowIndex; let cellIndex; rows.forEach((row, ri) => { row.forEach((cell, ci) => { if(cell === target) { rowIndex = ri; cellIndex = ci; console.log(ri,ci) } }) }) let hasWinner = false; if( rows[rowIndex][0].textContent === turn && rows[rowIndex][1].textContent === turn && rows[rowIndex][2].textContent === turn ){ hasWinner = true; } console.log(hasWinner) }
소스를 보면 위와같이 forEach문을 사용해서 현재 내가 클릭한 row,cells의 index값을 가져오는 소스입니다.
소스를 분석해보면 클릭한 위치를 찾기 위해서는 위와같은 소스가 만들어져야 한다는 것을 알 수 있습니다.
그런데 앞장부터 책을 보면서 진행을 하다보면 생각하는 과정이 어떻게 되서 위와같은 checkWinner라는 함수를 만들고 그 안에서 forEach를 사용해서 만들어지는지 전혀 모르겠어요.ㅠㅠ
그러니까..
[
[td],[td],[td]
[td],[td],[td]
[td],[td],[td]
]
이런식으로 배열이 만들어져서 그중에 2행 2열의 td의 클릭한 값을 가져오기 위해서는 제로초님이 만드신 forEach문을 사용해서 가져오면 된다는것은 알 수 있는데..
그런 소스가 만들어지기까지의 과정을 모르겠습니다.
어떻게 생각을 하고, 어떤 방향으로 고민을 해야 만들어질 수 있는지 훈련을 할려면 어떻게 해야할까요??
결론적으로.
소스를 보면 과정들이 이해가 가는데..
checkWinner라는 함수를 생각해내는 것 까지는 어렵지는 않은데(복잡해지니까 기능단위로 따로 빼면 되니까요)
checkWinner라는 함수 안에 forEach를 사용해서 문제를 하결하는 과정은 입문자 입장에서는 아무리 고민을 하고, 이해를 하려고 해도 쉽지가 않습니다.ㅠㅠ
이럴 경우에는 어떤식으로 진행을 하고, 고민을 하고 공부를 해야하는지 조언 부탁드립니다.ㅜㅠㅜ

답변 1

답변을 작성해보세요.

0

모든 것을 머리속에서 떠올릴 수는 없습니다. 천재가 아니라면요. 그럴 때는 이미 구현되어있는 많은 코드를 보고 그 코드를 분석하거나 외우는 수밖에 없습니다. 물론 남의 코드를 보기 전에 충분히 고민하는 시간은 가져야 합니다.

이차원 배열 데이터구조를 사용했는데 어떤 구조를 선택할지에 대해서는 자료 구조같은 수업을 들어보는 것도 좋습니다.

빠른 답변 감사합니다.

조언해주신대로 100% 이해하려는 욕심은 버리고 흐름이나 코드 분석 위주로 학습을 먼저 진행을 하는게 좋을 것 같네요.

보고 또 보고 하는식으로 진행을 해서 익숙해지고, 자연스럽게 외워지도록 진행을 하는게 좋을 것 같네요^^

일단 자바스크립트먼저 끝내고 자료구조도 학습을 진행하겠습니다.

감사합니다.

채널톡 아이콘