6자리 숫자 랜덤 - 6jali susja laendeom

캠프시작 2일차
왜 응용이 안될까.. 생각이 바로 이어지지 않을까!!
기초가 부족해서겠지.. 이해될때까지 반복 또 반복이다!

오늘의 코드는 버튼을 클릭하면 랜덤 6자리 숫자가 나오는 코드이다.
전에 짜놓았던 코드를 힐끔거리며 몇번이고 반복해서 익히도록 노력했다.
이해는 됐지만 백지를 준다면 다시 어버버거릴지도..

State를 활용한 완성코드

코드 요소는 못풀어봤지만 꼭 까먹지 않았으면 하는 부분 체크!

String(Math.floor(Math.random()*1000000)).padStart(6,"0")
string()은 숫자를 문자열로 바꾸는 함수

초기에 잘못 짠 함수
const [ rannum, getRanmum ] = useState(000000)
왜 잘못짰냐면 String을 활용했기 때문에 결과값은 숫자가 아닌 문자로 표현돼야 함
완성된 화면에서 보는 초기 000000은 숫자판정이 아닌 문자판정이어야 버튼을 눌렀을 때 랜덤숫자가 표현
그런데 String()의 특성을 잊고 단순히 숫자가 변경되는 것으로 착각함!

그래서 올바르게 수정한 코드는 (000000)이 아닌 ("000000")형태
const [ rannum, getRanmum ] = useState("000000")

덧붙여서 Document.getElementById()를 활용한 완성코드

오늘 함수형 코드를 배웠는데, 보다 효율적인 코드작성을 위해서는 State를 활용한 코드가 좋다고 하셨다.
그래서 기존에 let과 Document.getElementById()을 활용해서 짰던 코드를 State를 활용해 재작업 하고 비교해봤다.
확실히 코드길이가 짧은 함수형이 깔끔해보인다. 계속 바라보니 이해가 더 빠른것같기도 하다.
빨리 습득해서 극극극 개발 어린이에서 개발 청소년으로 성장하고 싶다! 화이팅!