2021. 12. 16. 18:09ㆍ[프론트엔드]_/[Javascript]_ES6
1] 현재 날짜, 시간 구하기.
변수를 선언하고 그 값에 querySelector로 편하게 객체에 접근한다.
새로운 변수를 각각 선언하고 그 값을 new 생성자를 통해 Date 함수를 통해 각각 값을 지정한다
getFullYear의 값은 4자리 수를 반환 (number)
getMonth의 값은 2자리 수를 반환 (number)
아래의 컨트롤러 함수를 따로 지정해서 컨트롤 하였다
index 를 받아서 처리한다.
new Date()안에 각각의 파라미터를 넣어주게 되면 해당 년, 월, 일 에 맞춰서 나오는데 2021년 12월 0일은 없다. 이 값은 해당 월의 마지막날을 알려주게 된다. 만약 그 달의 마지막날로부터 1일 전이라면 -1 이런식으로 변경해서 사용 할 수도 있다.
substring 과 비슷한건 substr이다 하지만 substr은 사용을 지양해야 한다.
substring은 2가지 parameter를 받는데 각각 index넘버 이며 0 1 2 ( 3번째 부터) 3 4 (4번째 값을 포함하지 않는) 값을 리턴한다. 4자리 수를 반환하는 곳에 사용했으니 각각 0123 인덱스이며 2번부터 4번인덱스까지 즉 뒤의 마지막 2글자만 반한한다.
2] Radio 핸들링
각각 input 속성을 부여한 radio1, radio2 를 querySelector를 이용해서 핸들링한다.
onchange를 이용해서 값이 변화할 때 마다 event를 부여할 수도 있고
checked를 이용해서 해당 radio값이 선택되었을 때는 true를 리턴하고 아닐 경우에는 false를 리턴하게끔 만들 수도 있다.
만약 raido1.checked = true 라고 사용하게 되면 해당 체크박스를 화면이 로딩시에 체크 되어 보이게 끔 할 수도 있다.
여기서 중요한 점은 만약 if문을 타기 전에 후에 checked 를 이용하게 되면 그 값은 정확히 전달 되어 있는가 ? 이다.
let var const 와 같이 호이스팅이 되는 부분이 아니기 때문에 순서가 중요하다.
체크가 되어있는 상태에서 핸들링을 하고 싶다면 페이지가 onload 되는 시점에 checked true를 해야하고
아닐 경우에는 전부 수행한 다음 해야한다.
위의 예제는 체크를 나중에 하였기 때문에 '안되어있다' log가 출력된다.
'[프론트엔드]_ > [Javascript]_ES6' 카테고리의 다른 글
[Ajax_Js]_기본정리 (0) | 2021.12.22 |
---|---|
[WEB 개발]_코드리뷰 1번 (0) | 2021.12.20 |
[WEB 개발]_사용한 함수, 기능 정리 3번 (0) | 2021.12.15 |
[WEB 개발]_사용한 함수, 기능 정리 2번 (0) | 2021.12.13 |
[프론트엔드]_JavaScript(es6)_9.Callback - > Promise 전환 (0) | 2021.12.12 |