본문 바로가기
반응형

분류 전체보기137

배열연습 const files = [ { name: 'file1.jpg', id: null }, { name: 'file2.jpg', id: 123 }, { name: 'file1.jpg', id: 456 }, { name: 'file3.jpg', id: null }, { name: 'file2.jpg', id: 789 },];여기서 name이 같은 파일들끼리 묶여 있으며, id 값이 있는 항목이 있습니다. 사용자가 id 값이 없는 요소(예: file1.jpg의 첫 번째 항목)를 클릭했을 때, 같은 파일 이름을 가진 항목 중에서 id 값을 출력하도록 해보기 첫번 째 방법아이디 값이 없는 요소 클릭 시, 해당 요소의 name을 기준으로 같은 파일을 찾음.해당 파일들 중 id 값을 갖고 .. 2024. 11. 22.
promise 대신 async await을 사용한 fetch 1. 기본 사용법async function fetchData(url) { try { const response = await fetch(url); // HTTP 요청 보내기 if (!response.ok) { // 응답 상태 확인 throw new Error(`HTTP error! status: ${response.status}`); } const data = await response.json(); // JSON 데이터 파싱 return data; // 데이터 반환 } catch (error) { console.error('Error fetching data:', error); }}// 사용 .. 2024. 11. 22.
소프트웨어 버전 표기 방법 보통 점(.)으로 구분되는 형식(예: X.Y.Z)이 사용됩니다.오픈소스 프로젝트도 이 방식을 따르며, 이를 통해 업데이트의 규모와 변경 사항의 성격을 알 수 있습니다. 일부 경우 버전에 **콤마(,)**가 추가되는 형식도 볼 수 있습니다. 1. 점(.)으로 구분된 버전 (Semantic Versioning)일반적으로 세 가지 숫자가 사용됩니다: X.Y.ZX (Major Version)주요 업데이트로 큰 기능 변화나 호환성에 영향을 미칠 때 증가합니다.이전 버전과의 호환이 깨질 수 있습니다.예: Tesseract 4.x → 5.x (OCR 엔진 성능과 모델 구조의 큰 변화)Y (Minor Version)새로운 기능 추가나 성능 개선이 있을 때 증가합니다.기존 버전과의 호환성은 유지됩니다.예: Tessera.. 2024. 11. 20.
MutationObserver를 활용한 변화 감지 이미지 리스트의 변화를 감지하고 새로 추가된 이미지를 포함한 리스트를 다시 출력하려면 JavaScript의 MutationObserver 또는 리스트의 변화를 감지할 수 있는 리스트 갱신 함수를 활용할 수 있습니다. 아래 방법 중 상황에 맞는 것을 사용하시면 됩니다.방법 1: MutationObserver를 활용한 변화 감지HTML 요소 내에서 이미지 리스트가 동적으로 추가될 때 사용하면 좋습니다. observer.observe()에서 childList: true 옵션으로 자식 요소(이미지)가 추가되거나 제거될 때마다 MutationObserver가 트리거됩니다.addImage() 함수를 통해 이미지가 추가되면 MutationObserver가 감지하고 업데이트된 리스트를 출력합니다. // 이미지 리스트 .. 2024. 11. 15.
728x90
반응형

티스토리툴바