제로초님의 자바스크립트 입문 강의를 들으면서 3~4강에서 새롭게 알게된 (혹은 알고 있으면 유용한) 개념에 대해 정리해 보려고 한다
📌 자바스크립트 기본 알림창
- alert : 알림창
- confirm : 확인창
확인 누르면 true, 취소 누르면 false 값 출력
- prompt : 입력창
prompt 함수에서 취소를 누르면 null 값 출력
🍞 prompt 응용 예시
사용자가 prompt에서 취소를 눌렀을 경우에 대한 개발을 해야할 때 Number(null) == NaN인 사실을 써먹으면 된다
if(NaN) == false로 취급되기 때문에 조건문에서 사용할 때 유용하다
📌 html 태그 선택 시 변수명
const $input = document.querySelector("input"); 와 같이 변수명 앞에 $를 붙이면 구분하기 쉽다
uerySelectorAll 메서드로 태그를 여러 개 선택하는 경우 변수명 앞에
$$를 붙인다
📌 유사배열
배열은 아니지만 겉보기에는 배열처럼 보이는 객체를 의미한다
유사배열은 배열의 메서드를 사용할 수 없다
📌 콜백함수
어떤 동작을 실행하고 난 뒤에 연이어 실행되는 함수를 의미한다
📌 태그의 내부 값 가져올 때 사용해야 하는 속성
보통 사용자의 입력을 받는 태그는 value를 사용한다
- value : input, select, textarea
- textContent : button, div, span
📌 순서도 만들 때 주의점
순서도를 만들 때 사용자의 이벤트(ex. 버튼 클릭, 입력창 글자 입력 등)가 필요한 곳에서 순서도를 끊어야 한다
📌 고차 함수 (high order function)
const onClickNumber = (number) => { return () => { ... } };화살표 함수에서 중괄호과 return이 만나면 생략이 가능하기 때문에 수정하면 다음과 같다
const onClickNumber = (number) => () => { ... }; // 고차 함수 (high order function)위와 같이 함수를 반환하는 함수를 고차 함수라고 한다
🍞 고차 함수 사용이유
고차 함수는 함수 간 중복을 제거하기 위해서 사용한다
📌 addEventListener( )
자바스크립트에서 이벤트를 추가할 때 사용하는 addEventListener 함수에서 두 번째 인자 자리는 함수가 들어가야 한다
함수를 변수에 넣고 사용할 때
변수명( )을 인자로 넣어버리면 함수가 아닌undefined를 넣는 것과 같다는 것을 주의해야 한다
👉변수명으로 넣어야 함
