본문 바로가기

전체 글234

(10)인터렉티브_자바스크립트_마우스 클릭 관련 세부 event.type 3가지, 마우스 포인터 이동 관련 세부 event.type □ 마우스 클릭 동작● 동작1_ 마우스 왼쪽 한번 클릭○ "마우스 왼쪽 클릭"으로 event.type 발생 종류, 순서 (Window 기준)- event.type 종류 :'mousedown''mouseup''click'- event.type 순서 : 'mousedown' => "mouseup" => 'click' ● 동작2_ 마우스 오른쪽 한번 클릭 ()○ "마우스 오른쪽 클릭"으로 event.type 발생 종류, 순서 (Window 기준)- event.type 종류 :'mousedown''mouseup''contextmenu'- event.type 순서 : 'mousedown' => "mouseup" => 'contextmenu'● 동작3_ 마우스 왼쪽 2번 연타 클릭 ()○ "마우스 오른쪽 클릭"으로.. 2024. 12. 3.
(5)비동기_자바스크립트_복습, Promise_all문법, try,catch,finally적용 ● 이론0_ 지난 시간에 API에서 employee를 빠르고 효율적으로 데이터 받기 코드 작성해보기 (힌트 : B잼민이의 벨튀 10명)async function getEmployee(id){ //fetch를 Parameter id에 따라 딱 그놈만 데이터 불러오기 const strData = await fetch(`https://learn.codeit.kr/api/employees/${id}`); const jsonData = await strData.json(); return jsonData;//Promise 객체로 반환}//APU Json 데이터는 인덱스 1부터임for(let i = 1;i● 이론1_ 여러 Promise 객체를 리퀘스트할 때, 사용하는 문법 => Promise.all()메소드○.. 2024. 12. 3.
(4)비동기_자바스크립트_API 불러오기 작업의 오류처리 => try,catch,finally문, 비동기함수 작성 then()문법 ,then()+try,catch,finally문, 작동원리 ● 이론0_ API 데이터 불러오고, 처리하는 코드 작성 시, 오류를 생각안했다.export async function getIntervers() { const strData = await fetch('https://learn.codeit.kr/api/interview-results'); const jsonData = await strData.json(); console.log(jsonData);}◇ 오류 요인fetch 하려고 하는 url이 잘못 기재url 내 데이터가 없다...등등● 이론1_ try{}Catch{}finally{} 문○ 정의 :try {..} : 비동기 작업과 최종 결과가 구현될 블록 , 중간에 오류가 날 시, catch 블록으로 이동됨catch {..} : try{}에서 넘어올 .. 2024. 12. 3.
(3)비동기_자바스크립트_★Promise문법 없이, API 데이터 다루기, Promise 문법 기초 : fetch() , await키워드,json()메소드 , 비동기 + 동기 작업하기 => async 키워드 ● 이론1_ Promise 문법 없이, 데이터 다루기 :○ 0단계 : json 데이터 출력법 => JSON객체 프로퍼티 메소드 stringify(jsonData,null,들여쓰기 개수?)# GPT 설명 (근데 중요한건 아니므로, 대략 읽으면서 끄덕 ㄱ)JSON.stringify(jsonData, null, 2)은 JavaScript에서 객체(jsonData)를 JSON 형식의 문자열로 변환하는 함수인 JSON.stringify를 사용하는 코드입니다.각 매개변수의 의미는 다음과 같습니다:jsonData: JSON 형식으로 변환할 데이터 객체. 예를 들어, { name: "Alice", age: 25 } 같은 객체를 JSON 문자열로 바꿉니다.null: replacer 매개변수로, 변환 시 특정 속성만 선택.. 2024. 12. 2.

티스토리툴바