멋쟁이v의 개발일지

비동기통신 fetch - 서버에 네트워크 요청을 보내고 새로운 정보를 받아오는 일을 수행 - fetch() : let promise = fetch(url, [option]); - option에 아무것도 넘기지 않으면 요청은 GET 메서드로 진행됨 - 응답시 단계 - 1단계 : 서버에서 응답헤더를 받자마자 fetch호출 시 반환되는 promese가 내장 클래스 Response의 인스턴스와 함께 이행 - (아직 본문(body) 도착하기 전 상태, 개발자는 응답 헤더를 보고 요청이 성공적으로 처리되었는지 아닌지 확인) - (http 상태는 응답 프로퍼티를 사용해 확인 status: http상태코드, ok: 불린값 http상태코드가 200~299사이일 경우 true) - 2단계 : 추가 메서드를 호출해 응답 본..

이벤트 - 브라우저는 처리해야 할 특정사건이 발생하면 이를 감지하여 이벤트를 발생 - 클릭, 키보드입력, 마우스 이동 등이 일어나면 특정한 타입의 이벤트 발생 - 이벤트 핸들러: 특정한 이벤트가 발생했을 호출될 함수 - 이벤트 핸들러 등록: 특정이벤트가 발생 시 이벤트 핸들러의 호출을 위임하는 것 자바스크립트의 이벤트 등록 방식 1) html 요소의 속성을 통해 이벤트 등록하는 방식(이벤트핸들러 어트리뷰트 방식) 2) css 선택자로 객체를 선택하여 이벤트를 등록하는 방식(이벤트 핸들러 프로퍼티 방식) 3) css 선택자로 객체를 선택하여 addEventListener 메소드로 이벤트를 등록하는 방식 html 요소 이벤트 (on 접두사) - 모든 테그는 on이라는 접두사를 가진 속성을 가지고 있다. - ..

요소노드 취득 - HTML의 구조나 내용 또는 스타일 등을 동적으로 조작하려면 먼저 요소 노드를 취득 id를 이용한 요소노드 취득 - document.getElementById(요소 id); - 반드시 문서노드를 통해 호출 한국스마트정보교육원 강의실301 한국스마트정보교육원 강의실302 태그 이름을 이용한 요소노드 취득 - document.getElementsByTagName(태그이름); - 모든 요소를 취득시에는 인수로 '*'를 전달 - 반드시 문서노드를 통해 호출 - HTMLCollection 객체에 담겨 반환 ksmart301 ksmart302 ksmart교직원실 class를 이용한 요소노드 취득 - document.getElementsByClassName(클래스이름); - 반드시 문서노드를 통해 ..

브라우저 객체 실습 실습1 실습. 1초마다 n이라는 변수에 값이 1씩 증가하는 코드를 작성하시오. 또한 10초마다 사용자에게 진행여부를 확인하고 진행시에는 n값 증가 지속적으로 진행 취소시 n값 진행 중단을 되도록 하시오. 실습2 실습. times h3태그의 텍스트노드에 1초마다 현재 시간을 출력하도록 하시오. (출력양식 : AM 10시 28분 30초) tag : #렌더링 #파싱 #파서 #URI #URL #URN #WAS #DOM #브라우저 Uploaded by N2T

📕 [목차]01. try ~ catch 예외처리02. 문법03. try ~ catch ~ finally 01. try ~ catch 예외처리💡실수, 예상치 못한 사용자 입력, 잘못된 서버 응답 등의 이유 발생시 스크립트가 실행이 중단을 방지하기 위한 처리 스크립트 에러가 발생해도 catch에서 에러 처리하기 때문에 스크립트가 실행이 중단되지 않는다. 02. 문법동작 순서👉🏻1️⃣ 먼저 try { } 안의 코드 실행 2️⃣ 에러가 없다면, try 안의 마지막 줄까지 실행. catch 블록은 건너뜀 3️⃣ 에러가 있다면, try 안의 코드의 실행이 중단되고, catch(err) 블록 안 코드 실행 error 프로퍼티 종류👉🏻name : 에러 이름, 정의되지 않은 변수 때문에 발생하는 에러인 경우 Refere..

내장객체 - 문자, 날짜, 배열, 수학 개체 등이 있다. - 주로 new 연산자를 활용하여 객체화 한다. 날짜 내장객체 - 날짜 정보를 얻거나, 날짜 정보에 관련된 작업을 할때 쓰인다. - 날짜의 정보는 사용자의 컴퓨터의 시간을 참조한다. - 구문 : let date = new Date(); - 1000의 정수값은 1초이다. 날짜객체 메서드 종류 03. 수학💡최댓값, 반올림, 최솟값 등 산술 연산자로 구할 수 없는 값을 구할 수 있는 객체이다.종류➡️ 절댓값 : Math.abs(숫자);➡️ 소숫점 반올림 : Math.round(숫자);➡️ 소숫점 올림 : Math.ceil(숫자);➡️ 소숫점 내림 : Math.floor(숫자);➡️ 소숫점 2번째 자리 반올림 : Math.round(숫자 * 10) / 1..

실습1 실습. 두수의 사칙연산의 결과를 반환하는 함수를 작성하시오. 실습2 실습. 아래의 실행코드에서 에러가 발생하지 않도록 메서드 내의 코드를 완성하여라. 객체와 함수(메서드) 실습 실습3 실습. 아래의 실행 코드를 보고 선언부를 완성하여라. [코드예제] 객체 생성자 함수 실습1 실습. 사람의 이름, 키, 몸무게를 입력받아 체중체크 객체를 생성하고 사람 별로 정상체중을 확인하는 메소드를 만들고 호출하시오. 정상체중 예시) (키 - 100) * 0.9 체중미달 예시) (키 - 100) * 0.9 - 5 체중초과 예시) (키 - 100) * 0.9 + 5 호출 예시) hongGilDongA = new CheckWeight('홍길동A', 172, 73); 출력 예시) 정상체중입니다, 체중미달입니다, 체중초과..

📕 [목차]01. 객체란?02. 참조변수03. 객체 선언04. 객체 활용05. 객체 실습 01. 객체란?💡객체 또는 오브젝트는 클래스에서 정의한 것을 토대로 메모리에 할당된 것으로 프로그램에서 사용되는 데이터 또는 식별자에 의해 참조되는 공간을 의미하며, 변수, 자료구조, 함수, 또는 메소드가 될 수 있습니다.특징➡️ 메모리에 등록된 데이터(함수, 메소드, 자료구조)➡️ 객체는 속성과 기능을 가지고 있다.➡️ 객체를 대입하는 변수는 메모리에 올라간 객체의 주소를 참조하고 있다.➡️ 객체를 대입하는 변수는 참조변수라고 한다. 02. 참조변수💡메모리에 등록된 객체의 주소값을 참조하는 변수(기본형X)[코드예제] 객체 참조 변수// 원시타입 : 값 // 서로 다른 곳을 가르킨다. // num1, num2 => ..

배열과 반복문 실습1 실습. 아래의 배열의 요소에 접근하여 콘솔에 차례대로 출력 하도록 하시오. 실습2 실습. 아래의 배열의 요소에 접근하여 이름만 콘솔에 차례대로 출력 하도록 하시오. ex) 손흥민, 황희찬, 이강인, 김승규 실습3 실습. 배열에 담긴 숫자형 값 중 짝수만 찾아 합산하여 그 결괏값만 출력하시오. 실습. 추출한 짝수만 evenArray 참조변수(배열)에 담으시오 실습4 실습. 아래의 배열에 학생의 점수가 담겨 있다. 학생들의 평균 점수를 구하시오. 실습5 실습. 아래의 배열에 학생의 점수가 담겨 있다. 60점 이상인 학생 수를 구하시오. 실습6 실습. 0~1000까지 홀수인 숫자만 배열에 담으시오. 홀수들의 합산을 구하시오. [코드예제] 배열 테이블var student = [ '헤리케인'..

📕 [목차]01. for 문02. while / do while03. break04. continue05. 레이블06. 반복문 실습 01. for 문💡주어진 조건식의 평가 결과가 거짓이 될때까지 코드 블럭을 반복 실행합니다.for 문 사용 예제 [코드예제] for문.jsfor(let i = 0; i < 5; i++) { console.log(i); // 0 1 2 3 4 } // 분리 let j = 0; for(; j < 5;) { console.log(j); // 0 1 2 3 4 j += 1; } // if문을 합친것과 같음 let k = 0; if(k < 5) { console.log(k); // 0 k += 1; // k = 1 } if(k < 5) { console.log(k); // 1 k +..