// 내생각 / 색깔글씨 : 중요표시 등
공부한 내용 - 프로젝트 하며 나온 코드 분석
담당 - 영화리뷰 CRUD (리뷰 등록, 수정, 삭제 구현)
JSON. parse <-> JSON.stringify
JSON. parse : JSON 형식의 문자열을 입력받아 자바스크립트 객체로 변환하는 내장함수
(이때 객체로 변환하는 과정을 파싱이라고 함)
JSON.stringify : 자바스크립트 객체를 JSON문자열로 변환하는데 사용됨
(선택적으로 replacer 함수를 두번째 인자로 전달 할 수 있음. 이 함수는 각 속성에 대해 호출 되어 값을 변환할 수 있음. 함수, 날짜, 정규표현식 등의 특수 객체는 문자열로 변환.)
addEventListener : JavaScript에서 이벤트 리스너를 등록하는 메서드입니다
- 특정 HTML 요소에 이벤트를 모니터링하게 해줍니다.
- 하나의 요소에 여러 개의 이벤트 핸들러를 등록할 수 있습니다.
- 이벤트 발생 시 호출될 함수를 지정할 수 있습니다.
- 이벤트 캡처링과 버블링 단계에서 동작을 제어할 수 있습니다
- IE8 이하에서는 attachEvent 메서드를 사용해야 합니다.
따라서 addEventListener는 JavaScript에서 특정 HTML 요소의 이벤트를 감지하고 처리하는 데 사용되는 핵심적인 메서드
사용방법 : 1. 이벤트 감지할 HTML 요소 선택
2.addEventListener()메서드 사용하여 이벤트 리스너 등록
- 첫번째 인자로 이벤트 유형 (ex. click, keydown 등) 지정
- 두번째 인자로 이벤트 발생시 호충될 콜백 함수 지정
3. 선택적으로 이벤트 캡처링과 버블링 단계에서 동작제어할 수 있음
ex) 버튼 클릭 이벤트 처리시
const button = document.querySelector('button');
button.addEventListener('click', (event) => {
console.log('Button clicked!');
});
query : 데이터 베이즈 조회, 데이터 요청 . 등데이터 처리하는 행위를 나타냄
- commentsContainer : 변수이름, 일반적으로 댓글을 담는 컨테이너요소
- append : 돔 api에서 제공하는 메서드, 선택한 요소의 마지막 자식 요소로 새로운 요소 추가
결론 : commentsContainer 요소의 마지막 자식 요소로 newComment추가
결론 : 사용자가 작성한 리뷰데이터를 브라우저 로컬스토리지에 저장할 수 있음. 이렇게 저장된 데이터는 페이지 새로 고침 후에도 유지되어 사용자가 이전에 작성한 리뷰를 계속 확인할 수 있음
'TIL' 카테고리의 다른 글
| 240510 TIL 열아홉번째날 Node.js 입문 1 - 1~2 (0) | 2024.05.10 |
|---|---|
| 240508 TIL 열일곱째날 (0) | 2024.05.08 |
| 240503 TIL 열다섯번째날 (0) | 2024.05.03 |
| 240502 열네번째날 TIL (0) | 2024.05.02 |
| 240501 열세번째날 TIL (0) | 2024.05.01 |