수강이 제한됩니다.
다른 수강생들이 자주 물어보는 질문이 궁금하신가요?
- 미해결웹 게임을 만들며 배우는 자바스크립트
가위바위보 질문있습니다
가위바위보.html <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> #computer { width: 160px; height: 200px; background: url('https://imagescdn.gettyimagesbank.com/500/17/859/219/0/824700804.jpg') -30px -80px; } </style> </head> <body> <div id="computer"></div> <div> <button id="scissor" class="btn">가위</button> <button id="rock" class="btn">바위</button> <button id="paper" class="btn">보</button> </div> <script src="가위바위보.js"></script> </body> </html> ------------------가위바위보.js var left = 0; setInterval(function () { if (left === 0) { left = '-175px'; } else if (left === '-175px') { left = '-300x'; } else { left = 0; } document.querySelector('#computer').style.background = 'url(https://imagescdn.gettyimagesbank.com/500/17/859/219/0/824700804.jpg) -30px -80px' + left + '0'; }, 100); ------------------질문 이미지 변경이 안되는데 어떤게 문제인지 모르겠습니다.
- 미해결웹 게임을 만들며 배우는 자바스크립트
구구단 js 질문
html <!doctype html> <html> <head> <meta charset="utf-8"> <title>구구단</title> </head> <body> <div id = "word1"></div> <form id="form"> <input type="text" id="inputText"> <input type="button" id="btn" value="제출"> </form> <div id="result"></div> <script src="gugudan.js"></script> </body> </html> js var random1 = Math.ceil(Math.random()*9); var random2 = Math.ceil(Math.random()*9); var answer = random1 * random2; var word1 = document.getElementById("word1"); word1.textContent = String(random1)+" * "+String(random2)+" = ?"; var form = document.getElementById("form"); form.addEventListener("submit",function(e){ e.preventDefault(); var inputText = document.getElementById("inputText"); var result = document.getElementById("result"); console.log(answer, inputText.value); if(Number(inputText.value)===answer){ result.textContent = "정답입니다."; random1 = Math.ceil(Math.random()*9); random2 = Math.ceil(Math.random()*9); answer = random1 * random2; word1.textContent = String(random1)+" * "+String(random2)+" = ?"; inputText.value=""; inputText.focus(); } else{ result.textContent="오답입니다."; inputText.value=""; inputText.focus(); } }); 구구단 화면을 HTML로 만들었는데 엔터하면 잘 작동하는데 버튼을 누르면 작동이 안돼요,, 어디가 문제일까요..?ㅠㅠ
- 미해결웹 게임을 만들며 배우는 자바스크립트
워... 지립니다..
감사합니다 선생님
- 미해결웹 게임을 만들며 배우는 자바스크립트
자스스톤 응용
초보자라 질문할 점이 참 많습니다. html파일은 깃허브에 있는 최종버전을 그대로 쓰는 상황입니다. js 파일은 카드 구성은 일단 했으나 구현 부분에 있어서는 주석으로 달아놓기는 했습니다만 function Card() 함수의 if문 부분을 어떻게 수정해야 하는지를 모르겠습니다. 일단 이 결과를 실행해보니 이런 결과가 나옵니다. 어떻게 수정해야 하나요? function Gcard(name, att, hp, cost) { this.name = name; this.att = att; this.hp = hp; this.cost = cost; } var 알파 = new Card('알파', 8, 35, 1); var 베타 = new Card('베타', 900, 8570, 6); var 감마 = new Card('감마', 5, 30, 1); var 오메가 = new Card('오메가', 450, 7500, 5); var 제타 = new Card('제타', 15, 70, 2); var 델타 = new Card('델타', 740, 6850, 5); var 시그마 = new Card('시그마', 6, 60, 1); var 람다 = new Card('람다', 320, 3140, 5); var 라디안 = new Card('라디안', 10, 170, 2); var 루트 = new Card('루트', 11, 60, 2); var 엡실론 = new Card('엡실론', 880, 9120, 6); var 파이 = new Card('파이', 7, 40, 1); var 로 = new Card('로', 6, 45, 1); var 타우 = new Card('타우', 400, 3065, 5); var 오미크론 = new Card('오미크론', 50, 180, 3); var 카파 = new Card('카파', 40, 220, 3); var 뮤 = new Card('뮤', 9, 85, 1); var 뉴 = new Card('뉴', 100, 550, 3); var 카이 = new Card('카이', 1500, 25620, 10); var 프시 = new Card('프시', 1620, 21000, 10); var 상대 = { 영웅: document.getElementById('rival-hero'), 덱: document.getElementById('rival-deck'), 필드: document.getElementById('rival-cards'), 코스트: document.getElementById('rival-cost'), 덱data: [], 영웅data: [], 필드data: [], 선택카드: null, 선택카드data: null, }; var 나 = { 영웅: document.getElementById('my-hero'), 덱: document.getElementById('my-deck'), 필드: document.getElementById('my-cards'), 코스트: document.getElementById('my-cost'), 덱data: [], 영웅data: [], 필드data: [], 선택카드: null, 선택카드data: null, }; 상대.덱data.push(알파) 상대.덱data.push(시그마) 상대.덱data.push(뮤) 상대.덱data.push(뉴) 상대.덱data.push(로) 상대.덱data.push(파이) 상대.덱data.push(제타) 상대.덱data.push(오메가) 상대.덱data.push(엡실론) 상대.덱data.push(프시) 나.덱data.push(델타) 나.덱data.push(타우) 나.덱data.push(람다) 나.덱data.push(라디안) 나.덱data.push(감마) 나.덱data.push(오미크론) 나.덱data.push(카파) 나.덱data.push(루트) 나.덱data.push(베타) 나.덱data.push(카이) var 턴버튼 = document.getElementById('turn-btn'); var 턴 = true; // true면 내턴, false면 니턴 function 덱에서필드로(데이터, 내턴) { var 객체 = 내턴 ? 나 : 상대; // 조건 ? 참 : 거짓; var 현재코스트 = Number(객체.코스트.textContent); if (현재코스트 < 데이터.cost) { return 'end'; } var idx = 객체.덱data.indexOf(데이터); 객체.덱data.splice(idx, 1); 객체.필드data.push(데이터); 객체.덱.innerHTML = ''; 필드다시그리기(객체); 덱다시그리기(객체); 데이터.field = true; 객체.코스트.textContent = 현재코스트 - 데이터.cost; } function 필드다시그리기(객체) { 객체.필드.innerHTML = ''; 객체.필드data.forEach(function(data) { 카드돔연결(data, 객체.필드); }); } function 덱다시그리기(객체) { 객체.덱.innerHTML = ''; 객체.덱data.forEach(function(data) { 카드돔연결(data, 객체.덱); }); 데이터.field = true; 객체.코스트.textContent = 현재코스트 - 데이터.cost; } function 영웅다시그리기(객체) { 객체.영웅.innerHTML = ''; 카드돔연결(객체.영웅data, 객체.영웅, true); } function 화면다시그리기(내화면) { var 객체 = 내화면 ? 나 : 상대; // 조건 ? 참 : 거짓; 필드다시그리기(객체); 덱다시그리기(객체); 영웅다시그리기(객체); } function 턴액션수행(카드, 데이터, 내턴) { // 턴이 끝난 카드면 아무일도 일어나지 않음 var 아군 = 내턴 ? 나 : 상대; var 적군 = 내턴 ? 상대 : 나; if (카드.classList.contains('card-turnover')) { return; } // 적군 카드면서 아군 카드가 선택되어 있고, 또 그게 턴이 끝난 카드가 아니면 공격 var 적군카드 = 내턴 ? !데이터.mine : 데이터.mine; if (적군카드 && 아군.선택카드) { 데이터.hp = 데이터.hp - 아군.선택카드data.att; if (데이터.hp <= 0) { // 카드가 죽었을 때 var 인덱스 = 적군.필드data.indexOf(데이터); if (인덱스 > -1) { // 쫄병이 죽었을 때 적군.필드data.splice(인덱스, 1); } else { // 영웅이 죽었을 때 alert('승리하셨습니다!'); 초기세팅(); } } 화면다시그리기(!내턴); 아군.선택카드.classList.remove('card-selected'); 아군.선택카드.classList.add('card-turnover'); 아군.선택카드 = null; 아군.선택카드data = null; return; } else if (적군카드) { // 상대 카드면 return; } if (데이터.field) { // 카드가 필드에 있으면 카드.parentNode.querySelectorAll('.card').forEach(function(card) { card.classList.remove('card-selected'); }); 카드.classList.add('card-selected'); 아군.선택카드 = 카드; 아군.선택카드data = 데이터; } else { // 덱이 있으면 if (덱에서필드로(데이터, 내턴) !== 'end') { 내턴 ? 내덱생성(1) : 상대덱생성(1); } } } function 카드돔연결(데이터, 돔, 영웅) { var 카드 = document.querySelector('.card-hidden .card').cloneNode(true); 카드.querySelector('.card-cost').textContent = 데이터.cost; 카드.querySelector('.card-att').textContent = 데이터.att; 카드.querySelector('.card-hp').textContent = 데이터.hp; if (영웅) { 카드.querySelector('.card-cost').style.display = 'none'; var 이름 = document.createElement('div'); 이름.textContent = '영웅'; 카드.appendChild(이름) } 카드.addEventListener('click', function() { if (턴) { // 내 턴이면 if (!데이터.mine || 데이터.field) { // 상대 카드거나 카드가 필드에 있으면 return; } if (덱에서필드로(데이터, true) !== 'end') { 내덱생성(1); } } else { // 상대 턴인데 if (데이터.mine || 데이터.field) { // 내 카드거나 카드가 필드에 있으면 return; } if (덱에서필드로(데이터, false) !== 'end') { 상대덱생성(1); } } 턴액션수행(카드, 데이터, 턴); }); 돔.appendChild(카드); } function 상대덱생성(개수) { for (var i = 0; i < 개수; i++) { 상대.덱data.push(카드공장()); } 상대.덱.innerHTML = ''; 상대.덱data.forEach(function(data) { 카드돔연결(data, 상대.덱); }); 덱다시그리기(상대); } function 내덱생성(개수) { for (var i = 0; i < 개수; i++) { 나.덱data.push(카드공장(false, true)); } 나.덱.innerText = ''; 나.덱data.forEach(function(data) { 카드돔연결(data, 나.덱); }); 덱다시그리기(나); } function 내영웅생성() { 나.영웅data = 카드공장(true, true); 카드돔연결(나.영웅data, 나.영웅, true); } function 상대영웅생성() { 상대.영웅data = 카드공장(true); 카드돔연결(상대.영웅data, 상대.영웅, true); } function Card(영웅, 내카드) { if (영웅) { this.att = Math.ceil(Math.random()) + 4; this.hp = Math.ceil(Math.random()) + 9999; //영웅영역 - 값 1개만 출력되야 함(실행시 10개 나옴)-공격력 5 체력 10000의 고정값 this.hero = true; this.field = true; } else { this.att = Math.ceil(Math.random() * 5); this.hp = Math.ceil(Math.random() * 5); //카드영역- 각 팀당 미리 셋팅 된 10개의 고유 카드 중 5개 랜덤으로 뽑히게 해야함 this.cost = Math.floor((this.att + this.hp) / 2); } if (내카드) { this.mine = true; } } function 카드공장(영웅, 내카드) { return new Card(영웅, 내카드); } function 초기세팅() { 상대덱생성(5); 내덱생성(5); 내영웅생성(); 상대영웅생성(); 화면다시그리기(true); // 상대화면 화면다시그리기(false); // 내화면 } 턴버튼.addEventListener('click', function() { 턴 = !턴; var 객체 = 턴 ? 나 : 상대; document.getElementById('rival').classList.toggle('turn'); document.getElementById('my').classList.toggle('turn'); 필드다시그리기(객체); 영웅다시그리기(객체); 턴 = !턴; // 턴을 넘기는 코드 if (턴) { 나.코스트.textContent = 10; } else { 상대.코스트.textContent = 10; } document.getElementById('rival').classList.toggle('turn'); document.getElementById('my').classList.toggle('turn'); }); 초기세팅();
- 미해결웹 게임을 만들며 배우는 자바스크립트
자스스톤 응용법 질문
math 객체를 사용하셔서 난수값 연산으로 랜덤 능력치를 가진 5장의 카드가 덱에 생성되게 되어있는 것 같습니다만 카드 var 상대 = { 영웅: document.getElementById('rival-hero'), 덱: document.getElementById('rival-deck'), 필드: document.getElementById('rival-cards'), 코스트: document.getElementById('rival-cost'), 덱data: [알파, 베타, 감마, 오메가, 제타, 델타, 빔펠], 영웅data: [], 필드data: [], 선택카드: null, 선택카드data: null, 이런 식으로 기존 코드에 덱 data 배열에 따로 미리 만들어둔 카드 이름을 넣고 이런 식으로 미리 카드에 따른 능력치 값을 입력시켜놓았는데 이걸 화면상에 구현하는 법을 모르겠습니다. function Card(name, att, hp, cost) { this.name = name; this.att = att; this.hp = hp; this.cost = cost; } var 알파 = new Card('알파', 8, 35, 1) var 베타 = new Card('베타', 900, 8570, 6) var 감마 = new Card('감마', 5, 30, 1) var 오메가 = new Card('오메가', 450, 7500, 5) var 제타 = new Card('제타', 15, 70, 2) var 델타 = new Card('델타', 740, 6850, 5)
- 미해결웹 게임을 만들며 배우는 자바스크립트
자스스톤
자스스톤 html파일과 js파일의 완성본 코드를 한번에 볼 수 있는 깃허브 주소가 있으시면 알려주세요
- 미해결웹 게임을 만들며 배우는 자바스크립트
제가 찾은 버그가 있는데요.!
깃허브 코드 돌려봤을 때 버그가 있어서 질문 올립니다. 겜이 끝나고 다시 초기세팅될 때 상대카드 누르면 NaN이라고 뜨는 버그가 있고요. (이건 해결했습니다) 덱에서 필드로 놓고 카드를 써서 턴오버상태가 됐을 때 만약 코스트가 남아 덱의 카드를 누르면 턴오버, selected 상태가 풀립니다. 필드의 상태를 고정시켜야 문제가 해결될 것 같은데.. 흠 화면다시그리기로 인해 버그를 해결 못하겠네요. 잠시 제가 생각해본 해결책은 현재 필드의 데이터상태를 다른 변수로 선언한 배열에다 저장하고 화면다시그릴때 저장된 배열의 상태를 적용해주는 형태로 하면 될 것 같은데.. 조금만 힌트를 주실 수 있나요.?
- 미해결웹 게임을 만들며 배우는 자바스크립트
join undefined..?
안녕하세요 선생님! 질문이 있습니다 console.log로 arr, arr.join(""), answer 다 찍어봤는데 잘나오는데 비교문에서부터 실행이 안됩니다. ㅠ__ㅠ 영어로만했지 강의랑 똑같이 썻습니다. 전체코드도 남겨봅니다... 왜안되는걸까요?... https://github.com/jellybrown/javaScript/blob/master/baseball.js
- 미해결웹 게임을 만들며 배우는 자바스크립트
[로또] 쌤 배열 랜덤 while 반복문 관련 질문 드려요
쌤 while 문을 while (후보군.length > 0) { } 이렇게 ↑후보군.length > 0 으로 안하고 while (후보군.length){ } 후보군.lenght 로만 해도, 랜덤 반복문이 돌아가요. > 0 이 없어도 조건문이 참이니 돌아가는거 같은데 이 경우, > 0 빼도 될까요? 어차피 배열 후보군은 0 보다 계속 클테니 상관 없는게 아닐까요? p.s 쌤 2020 초보 자바스크립트 유튜브 라이브방송 잘보구 있어요 ㅠㅠ 아직 로또 수업밖에 진도 안나갔지만, 복습겸 따라하며 라방 볼께요ㅠ
- 미해결웹 게임을 만들며 배우는 자바스크립트
슨생님 지뢰찾기에서 질문있어요!
슨생님 지뢰찾기에서 옆칸.click()으로 재귀함수가 되잖아요 값을 많이 입력하면 콜스택이 되버려서 setTimeout 으로 바꿧더니 너무 느리게 클릭이 되버리는데 이런경우에는 어떻게 해결해야 할까요? 밑에코드부분이요 ~~ if (dataset[옆칸줄][옆칸칸] !== 코드표.연칸) { 옆칸.click(); }
- 미해결웹 게임을 만들며 배우는 자바스크립트
html로 테이블을 작성하게되면 각 칸들을 배열에 어떻게 넣을 수 있을까요?
js로 반복문을 통해서 td태그를 생성함과 동시에 배열에 집어 넣는 방법 말고 html로 테이블의 틀을 작성했다면, 각 칸들의 값을 어떻게 '칸들'변수에 집어 넣을 수 있을까요?
- 미해결웹 게임을 만들며 배우는 자바스크립트
쌤 if~else 문 질문 드려요
쌤 숫자야구 틀렸을때, if 틀린횟수 > 3 문에 else 안넣으면 결과.textContent="3번 넘게 틀려서 실패. 답은" + 숫자배열.join(''); 실행 안되는 이유가 뭔가요? else 안넣으면 해당 if 문 무시 되고 결과.textContent="스트라이크" +"볼입니다" 로 바로 뛰어넘어가는 이유가 있을까용...?
- 미해결웹 게임을 만들며 배우는 자바스크립트
쌤 횟수 순서 관련 질문 드려요... [숫자야구]
[숫자야구] 쌤 힌트 주신거 계속 생각해서 짜니까 구현 됐어요! 감사합니다! 근데 횟수 순서가 반대로 나와요; 횟수 3번 남음 -> 2번 남음 -> 1번 남음 -> 횟수 다 씀! // 이렇게 돼야 하는데 횟수 1번 남음 -> 2번 남음 -> 3번 남음 -> 횟수 다 씀! // 이렇게 나와요; 횟수 증감문이 1씩 증가하니까 당연히 그렇게 되긴 할텐데.. 횟수 - 1 하면, Number 함수 -1 해도 , Nan 이 나와서요.. 어떻게 하면 3번 부터 나올까요...?? 이부분 한번만 더 도와주세용....감사합니다~! else { //답이 틀리면 //답이 틀리면 스트라이크,볼을 알려줘야 하니까 var 답배열 = 답.split(""); var 스트라이크 = 0; var 볼 = 0; 틀린횟수 += 1; 횟수 += 1; if (횟수 < 4) { //1번 틀릴때마다 console.log("답이틀리면", 답배열); //for 반복문을 돌면서 볼,스트라이크 있나 확인 입력창.value = ""; 입력창.focus(); 숫자후보 = [1, 2, 3, 4, 5, 6, 7, 8, 9]; 숫자배열 = []; for (var i = 0; i < 4; i += 1) { var 뽑은것 = 숫자후보.splice(Math.floor(Math.random() * (9 - i)), 1)[0]; 숫자배열.push(뽑은것); } 틀린횟수 = 0; 횟수결과.textContent = "기회 " + 횟수 + "번 남음!"; 입력창.value = ""; 입력창.focus(); } else { 횟수결과.textContent = "우헤헤! 기회는 없다! 횟수 다씀!"; 입력창.value = ""; 입력창.focus(); 숫자후보 = [1, 2, 3, 4, 5, 6, 7, 8, 9]; 숫자배열 = []; for (var i = 0; i < 4; i += 1) { var 뽑은것 = 숫자후보.splice(Math.floor(Math.random() * (9 - i)), 1)[0]; 숫자배열.push(뽑은것); } 횟수 = 0; }
- 해결됨웹 게임을 만들며 배우는 자바스크립트
[ 숫자야구 ] 답변할때마다 기회 몇번 남았는지 표시 관련 질문 드려요
쌤.. 답변할때마다 기회 몇번 남았는지 표시 하는거 힌트 없을까요.. 이미 힌트 주신거 아는데...그래두 잘 모르겠어요... if 구문을 뭐로 해야 할지...순서를 어디에 배치해야 될까요 1 / 입력창 답 칠때마다 2 / '기회 ~번 남음' 텍스트 나오고 3 / 3회 반복후 4 / 다시 처음으로 돌아감. 이렇게 생각중인데요.. 코드로는....ㅠㅠ....; if (답 !== 입력창) { this.textContent = "기회 번 남음"; }
- 해결됨웹 게임을 만들며 배우는 자바스크립트
쌤 숫자야구 반복문 undefined 관련 질문 드려요
쌤 undefined 막으려고 9876 숫자 1씩 줄이려면, 9 - i 를 해야 한다는건 이해를 했어요. 근데 그 원리가 이해 안가요ㅠㅠ 9 - i 는 그냥 9 아닌가요? () * 9 는 10 자릿수고 () * ( 9 - i ) 는 9 자릿수인데 i 가 0123 되면 9 - i 는 9876 이 돼서 여기서 9876 , 1 씩 줄어드는 이유는 반복문 돌면서 i 는 1씩 증감 된다는 건가요?
- 미해결웹 게임을 만들며 배우는 자바스크립트
볼을 카운트할 때 indexOf 부분 질문드립니다.
빨간색 표시한 부분에서 답배열은 입력한 수 4자리가 들어가게 될텐데. 반복문이 왜 3번만 반복하는지 궁금합니다! ------------------------------------- 추가 질문입니다. 강의해주신 내용을 토대로 응용을 해보는 단계인데 입력했던 답과, 스트라이크 볼 결과 기록이 화면에 남았으면해서 시도를 하고 있는데 입력 할 때마다 console.log() 에는 strike, ball을 표시 할 수 있는데 문서상에서는 매번 초기화가 되고있습니다. 기록을 유지하는 방법을 적용하고 싶어서 몇 시간 째 이런저런 시도를 해보기도하고 웹서핑을 해보았지만 도저히 못찾겠는데 어떤 방법으로 시도해 볼 수 있을지 조언을 구하고 싶습니다! + 덧붙여 이렇게 좋은 강의를 제공해주셔서 진심으로 감사드립니다. :)
- 미해결웹 게임을 만들며 배우는 자바스크립트
깃헙 코드질문
안녕하세여 강의를 듣다가 좀더 효율적인 코드는 무엇일지 싶어서 제로초님 깃헙에가서 한번 보았습니다 for (var i = 0; i < 당첨숫자들.length; i++) { (function 클로저(j) { // var j = i; setTimeout(function () { 공색칠하기(당첨숫자들[j], 결과창); }, (j + 1) * 1000); })(i); } 코드를 이렇게 작성하셨던데 (fucntion (){})(i) function밖을 괄호로묶고 그다음 i 를 넣은것이 무엇인지 궁금해서 질문드립니다.
- 미해결웹 게임을 만들며 배우는 자바스크립트
구구단 반복문
while(true){ var 숫자1 = Math.ceil(Math.random()*9) +1 var 숫자2 = Math.ceil(Math.random()*9) +1 var 결과 = 숫자1 * 숫자2 var 조건 = true; var 답 = prompt ( String(숫자1) + '곱하기' + String(숫자2) + '는?') while (조건) { if (결과 ===Number(답)) { alert ('딩동댕'); 조건 = false; } else { alert ('땡') } } } 선생님 2번째 while 반복분 변수 답을(굵은글귀로 표시) 1번째 while 반목문에 넣으면, if 조건문 틀렸을때 alert ('땡') propmt 창 계속 뜨고, 다시 문제 뜨는창으로 돌아가지 않아, 조건 = false; 증감식 넣어주니,다시 문제 뜨는 창 반복 되더라구요. 저 변수(굵은글귀로 표시) 위치만 바꿨을 뿐인데, else 에다가 증감식을 한번 더 넣어줘야 반복문 실행되는 이유가 뭔가요? 혼자 여기저기 위치 옮겨보는 도중, 이런 문제가 발생해 질문드려요ㅠ.ㅠ
- 미해결웹 게임을 만들며 배우는 자바스크립트
구구단 관련 문의
선생님 구구단 if 문에 조건 달때 if (결과 === Number(답)) { ~ 이때 왜 (답) 변수달때 괄호 () 치나요 ?
- 미해결웹 게임을 만들며 배우는 자바스크립트
지뢰찾기 질문 드립니다
if (dataSet[줄][칸] === 'x') { e.currentTarget.textContent = '쾅!'; alert('지뢰를 밟았습니다. Game Over!!'); } else { let 주변 = [ dataSet[줄][칸 - 1], dataSet[줄][칸 + 1], ]; if (dataSet[줄 - 1]) { 주변 = 주변.concat([dataSet[줄 - 1][칸 - 1], dataSet[줄 - 1][칸], dataSet[줄 - 1][칸 + 1]]); } if (dataSet[줄 + 1]) { 주변 = 주변.concat([dataSet[줄 + 1][칸 - 1], dataSet[줄 + 1][칸], dataSet[줄 + 1][칸 + 1]]); } e.currentTarget.textContent = 주변.filter((e) => { return e === 'x'; }).length; console.log(주변); } 여기서 줄의 경우에는 -1이 들어가면 에러가 뜨는데 칸의 경우는 -1이 들어가면 undefined이 뜨는데 왜그런지 모르겠습니다.