가장 기본적인 DOM 조작 연습입니다. document.querySelector(), addEventListener, element.classList.add() 등의 기본 API에 익숙해지는 것이 목표입니다.요구사항목록 추가: 입력 필드에 텍스트를 입력하고 '추가' 버튼을 누르면 목록에 새로운 항목이 추가되어야 합니다.항목 완료: 목록 항목을 클릭하면 complete 상태로 토글되며, 텍스트에 취소선이 생겨야 합니다.항목 삭제: 각 항목 옆에 'X' 버튼을 추가하고, 클릭 시 해당 항목이 리스트에서 제거되어야 합니다.📌 적용 가이드스크립트: jQuery 대신 바닐라 자바스크립트(ES6) 문법만 사용하여 구현하세요.HTML/CSS:BEM: todo-app, todo-app__input-group, tod..

요구사항 및 힌트Promise 반환 함수 정의:delayLog라는 함수를 정의합니다. 이 함수는 message와 delayTime을 인수로 받습니다.이 함수는 즉시 새로운 Promise 객체를 반환해야 합니다. (힌트: return new Promise((resolve, reject) => { ... }))비동기 작업 및 성공:Promise 생성자 내부에서 setTimeout을 사용하여 delayTime 후에 실행되도록 합니다.타이머가 만료되면, Promise를 성공 상태로 만듭니다. (힌트: resolve(message) 호출)Promise 체이닝:delayLog 함수를 두 번 연속으로 호출하고 **.then()**으로 연결하여, 첫 번째 작업이 완료된 후 두 번째 작업이 실행되도록 순서를 보장합니다...

요구사항비동기 함수 정의:processData라는 함수를 정의합니다.이 함수는 두 개의 인수를 받습니다:data (처리할 임의의 데이터 문자열)callback (데이터 처리가 완료된 후 실행될 함수)비동기 작업 시뮬레이션:processData 함수 내에서 setTimeout 타이머 함수를 사용합니다.타이머는 2초 (2000ms) 후 작동하도록 설정합니다. (비동기 작업이 오래 걸리는 상황을 시뮬레이션)데이터 처리 및 콜백 실행:2초가 지난 후, 콜백 함수를 실행하기 전에 data 문자열 뒤에 "- 처리 완료됨"이라는 텍스트를 붙여 새로운 결과 문자열을 만듭니다.이 결과 문자열을 callback 함수의 인수로 전달하며 호출합니다.사용 및 출력:handleResult라는 별도의 콜백 함수를 정의합니다. 이 ..

요구사항데이터 정의 (JS):다음 구조를 가진 상품 객체 배열을 JavaScript 코드 내에 정의합니다. 이 배열을 cartItems 변수에 저장하세요.JavaScriptconst cartItems = [ { id: 1, name: '노트북', price: 1200000, quantity: 1 }, { id: 2, name: '무선 마우스', price: 35000, quantity: 2 }, { id: 3, name: '모니터', price: 300000, quantity: 1 }, { id: 4, name: '키보드', price: 80000, quantity: 3 }];총합 계산 함수 구현:calculateTotal이라는 함수를 구현합니다.이 함수는 cartItems 배열을 ..

요구사항HTML 구조:할 일 입력 필드와 버튼을 포함하는 을 만듭니다. (할 일 입력)추가할 일 목록이 표시될 빈 태그 (id="todo-list")를 만듭니다.CSS 스타일 (선택 사항):추가된 항목에 마우스 오버 시 배경색이 바뀌는 등 간단한 스타일을 적용하여 시각적으로 구분합니다.JavaScript 기능 (가장 중요):할 일 추가 기능:폼 (#todo-form)에 submit 이벤트 리스너를 추가합니다.이벤트 발생 시 페이지 새로고침을 막고 (힌트: event.preventDefault()) 입력된 텍스트를 가져옵니다.새로운 요소를 생성하고, 그 안에 입력된 텍스트와 삭제 버튼 (삭제)을 포함시킵니다.새로운 요소를 #todo-list에 추가합니다.입력 필드 (#todo-input)를 비웁니다..