목록프론트/java script 재료 (7)
SOCO
1. 배열만들기 Array().fill() Array(45).fill()//undefined가 45개인 배열을 만듦 2. 배열과 반복문 : 배열명.map( () => {}) const candidate = Array(45).fill().map((element, index) => index+1); //undefined 45개로 구성된 배열을 앞에서 부터 각각 index+1로 바꿈 //(45) [undefined, undefined, ---, undefined] //(45) [1,2,3,4,---,45] 3. 랜덤으로 겹치지 않게 숫자 뽑기 (vs 야구게임과 비교) (1) 야구게임 1~9까지 있는 배열에서 랜덤으로 하나씩 뽑아서 옮기고 삭제하기를 반복 const pull = Array(9).fill().ma..
베스킨 라빈스 31게임 도전 고민 1. 숫자를 어떻게 받아야할까 방법1)input 3개를 만든다 방법2) 채택 input 1개를 만든다사용자에게 각 숫자 사이에 쉼표를 입력하라고 한다.사용자에게서 받은 문자열을 쉼표를 기준으로 split함으로써 배열 형태로 만든다 고민 2. 앞 순서 사람과의 중복 확인 방법1) 앞 순서의 사용자가 입력한 모든 값을 저장하는 배열을 만든다. : push 해당 차례의 사용자가 입력한 값이 배열내에 포함되어있는지 확인한다. : includes 방법2) 1~31까지의 숫자가 들어있는 배열을 만든다 : Array(31).fill().map 앞 순서의 사용자가 입력한 모든 값을 배열에서 제외한다 : splice 해당 차례의 사용자가 입력한 값이 배열내에 포함되어있지 않은지 확인한다..
1. form 태그 button이 달린 input 태그는 form으로 감싸주는 것이 추세라고 한다. 확인 이 경우 input 태그에 바로 이벤트를 다는 것이 아니라 form 태그에 이벤트를 달아준다. 2. submit 이벤트 (1) form안에 있는 button을 누르면 submit이벤트가 호출된다. 확인 (2) event.preventDefault() : 기본동작 막기 submit 이벤트는 호출되는 경우 페이지가 새로고침된다. 확인 (3)event.target[index] : form안에 있는 태그들을 개별적으로 부르는 방법 확인 event.target[0]는 event가 target하는 form 태그의 첫번째 태그인 input 태그를 의미한다. (4) 추가 : submit은 모든 버튼에 다 적용됨 f..
1. readonly : 읽기 전용 2. input type input과 input type="text"의 차이가 무엇일까? 웹 상으로는 똑같이 구현되는 것 같은데.... 3. box넓이 설정시 border을 기준으로 *{box-sizing : border-box} 4. 불리언으로 형 변환시 false가 되는 data 0, NaN, undefined, null, '' => if문의 조건식 작성시 유용함 왜냐면 if문의 경우 조건식이 true일 때 실행되기 때문이다! 5. value, textContent tag의 내용값을 불러올 때! document.querySelector('input').value document.querySelector('button').textContent 6. 형변환 consol..
1. console.log console.log( ) => console창에 괄호 안의 내용을 '그려라'는 뜻이다. 반환값은 undefined이다. console.log('안녕'+3) console.log('안녕',3) console.log에는 +와 ,를 사용할 수 있다. 내가 발견한 차이점은 우선 +를 하는 경우에는 안녕3으로 나타나지만, ,를 하는 경우에는 안녕 3으로 나타난다. 또한 +의 경우 3이 검은색으로 나타나지만 ,를 하는 경우 3이 파란색으로 나타난다. console.log('3') console.log(3) 문자열 3의 경우 검은색으로 나타나고, 숫자 3의 경우 파란색으로 나타나는 걸 확인했는데, 아마도 +를 사용하는 경우에는 문자열로 타입이 변환되지만, ,를 사용하는 경우에는 타입이 그..
1. console.log console.log( ) => console창에 괄호 안의 내용을 '그려라'는 뜻이다. 반환값은 undefined이다. console.log('안녕'+3) console.log('안녕',3) console.log에는 +와 ,를 사용할 수 있다. 내가 발견한 차이점은 우선 +를 하는 경우에는 안녕3으로 나타나지만, ,를 하는 경우에는 안녕 3으로 나타난다. 또한 +의 경우 3이 검은색으로 나타나지만 ,를 하는 경우 3이 파란색으로 나타난다. console.log('3') console.log(3) 문자열 3의 경우 검은색으로 나타나고, 숫자 3의 경우 파란색으로 나타나는 걸 확인했는데, 아마도 +를 사용하는 경우에는 문자열로 타입이 변환되지만, ,를 사용하는 경우에는 타입이 그..
끝말잇기 코딩을 위해 필요한 개념 1. prompt, confirm, alert 처음 웹 페이지 입장 시 창이 뜨는 경우는 3가지로 나눠볼 수 있다. 1) prompt : 입력값을 받는 경우 prompt("몇 명이 참가하나요?") 2) confirm : 예, 아니오로 대답하는 경우 confrim("x명이 참가하나요?") 3) alert : 확인으로만 대답하는 경우 alert("끝말잇기 게임입니다") 2. Number, ParseInt, ParseFloat data type이 숫자가 아닌 것을 숫자로 바꾸는 역할을 한다 ParseInt는 정수로만 바꾼다. ParseInt는 해당 문자열에 있는 정수를 뽑아낼 수 있다. console.log(ParseInt('3월')) 3 console.log(Number('..