복습 앞에서 배운 내용을 복습해보겠습니다. 함수를 선언하는 부분과 함수를 호출하는 부분은 명확히 구분해야 하는 것을 배웠는데요. 아래와 같은 코드가 함수를 선언하는 코드이고, const add = (a, b) => a + b; function calculator(func, a, b) { return func(a, b); } 다음과 같이 함수이름 뒤에 매개변수를 선언한다면 함수를 호출하는 것이 됩니다. 그리고, 함수를 호출했을 때 이를 return 값으로 대입해 생각하면 쉽습니다. add(3, 5); // 8 calculator(add, 3, 5); // 8 const onClick = () => (event) => { console.log('hello'); }; document.querySelector(..
함수와 함수 호출의 차이 자바스크립트를 입문하는 초보자들이 한 번씩 겪는 문제입니다. 다음 예제를 보면서 자세한 설명 이어가겠습니다. const add = (a, b) => a + b; function calculator(func, a, b) { return func(a, b); } 다음 두 함수 add, calculator 함수가 있습니다. 두 함수를 사용하는 방법에 대한 설명인데요. 우선, add 함수를 사용하기 위해선 add(3, 5); 를 하게 되면 8 이라는 값이 return 합니다. 너무 간단하죠. 하지만, 이번에 주목해야 할 부분은 calculator 함수를 사용하면서입니다. calculator 함수를 사용해봅시다. 일반적으로는 함수호출(func())이 아닌 함수(func) 만 작성했을텐데 ..
리액트의 현주소 현재, 2022년 한국에서는 리액트를 주로 사용하는 듯합니다. 물론, 뷰를 사용하는 si 업체나 대기업의 몇몇 특정 팀이 뷰를 사용하지만, 사실 거의 대다수는 리액트를 사용하는 추세입니다. 취업하는 입장에선 역시 뷰보다 리액트를 선호하는 편입니다. 그렇다고 리액트가 뷰보다 압도적인 성능을 갖고 있냐에 대해서는 그렇다고 할 순 없습니다. 단지, 국내 기준일 뿐..! 백엔드에선 노드보다 자바를 선호하는 것처럼 한국은 기술적 편향이 있어 한 번 대세가 되면 앞으로도 대세가 될 가능성이 높아 앞으로 혁신적인 기술이 있지 않는 한 리액트는 10년 정도는 문제 없을 기술일 듯 싶습니다. 싱글 페이지 애플리케이션 언어들 뷰와 리액트 모두 공통적으로 해결하고자 하는 것은 동일합니다. 때문에 뷰와 리액트..
두더지 게임 코드리뷰(복습) 두더지 게임 페이지의 최종코드를 보면서 복습을 해보도록 하겠습니다. 0초 0점 남은 목숨: 3 시작 $start.addEventListener start 이벤트는 게임 시작을 위해 '시작' 버튼에 이벤트를 넣은 것입니다. 1. 이미 시작했으면 return 으로 버튼클릭을 무시합니다. false 였던 started 를 true 로 바꿔줘 버튼이 두 번 클릭되는 것을 방지합니다. if (started) return; // 이미 시작했으면 무시 started = true; 2. 0.1 초 단위로 줄어드는 타이머를 만들어주기 위해 setInterval 을 이용해 0.1 초씩 0.1 을 빼는 기능을 합니다. 타이머의 숫자는 time 으로 변수 선언하고, 이를 $timer 의 textC..
2048게임 코드리뷰(복습) 2048 게임 페이지의 최종코드를 보면서 복습을 해보도록 하겠습니다. 2048.html 0 되돌리기 $back.addEventListener back 에 추가한 이벤트는 사용자가 moveCells 함수를 통해 숫자들을 움직였을 때, 실행했던 결과가 마음에 들지 않아 바로 이전의 상황 및 모습으로 돌아가고 싶을 때 이를 되돌리게 해주는 역할을 합니다. console 창 더보기 console.log(prevData); console.log(history); 1. history 는 moveCells 함수에서 함수를 실행할 때마다 그 값이 바뀌는데, history 는 숫자를 움직였을 때(함수를 실행했을 때), 해당 숫자들의 모습을 이중 배열로 table 로 변수선언하고, 해당 점수 ..
지뢰 찾기 코드리뷰(복습) 지뢰찾기 페이지의 최종코드를 보면서 복습을 해보도록 하겠습니다. mine-sweeper.html 생성 0초 function onSubmit onSubmit 함수는 사용자가 직접 지뢰판을 커스텀할 수 있게 해주기 위해 만들어 둔 form 태그의 input 에 입력한 값을 javascript 내에서 함수들끼리 상호작용하는 역할을 수행합니다. console 창에 해당 변수들을 보며 설명해보려고 합니다. console.log(event) console.log(event.target) console.log(event.target.row) console.log(event.target.cell) console.log(event.target.mine) console.log(startTime)..
