본문 바로가기

녕's BigData/JavaScript

[javaScript] XMLHttpRequest, Ajax XMLHttpRequest(xhr) > 자바스크립트가 Ajax를 사용할 때 사용하는 객체 XMLHttpRequest 객체 > XMLHttpRequest 객체는 빈 편지지와 같음 > 빈 편지지에는 수취인, 배송방식, 내용물을 넣을 수 있음 > XMLHttpRequest 생성자 함수로 XMLHttpRequest 객체를 만듬 > XMLHttpRequest 객체의 open() 메서드로 편지지의 전송 위치와 방식을 지정 ex) var request = new XMLHttpRequest(); request.open(전송 방식, 경로, 비동기 사용 여부) XMLHttpRequest 객체 > Ajax요청을 활용한 동적 요소 생성 request확인 > XMLHttpRequest 객체 코드를 작성한 html 파일 열기 >.. 더보기
[JavaScript] document.write와 document.writeln HTML 페이지와 자바스크립트 객체 > 자바스크립트 코드는 브라우저로부터 3가지 유형의 객체(BOM객체, 코어객체, HTML DOM객체)를 제공받아 활용할 수 있음. > BOM(Browser Object Model) 객체 : window, history > 코어 객체 : array, date > HTML DOM(Document Object Model) 객체 : document, body DOM Tree > HTML 태그(형태)의 포함관계에 따라 DOM 객체의 트리 형성 > 하나의 document에서 > html 생성 > head와 body로 나뉘고 > head에서 title, meta 등으로 뻗어나감 > body에서 p, fom 등으로 뻗어 나감 > DOM 트리는 부모 자식 관계 > HTML 태그 당 하.. 더보기
[JavaScript] 사용자 객체 만들기 사용자 객체 만들기 > 사용자가 새로운 타입의 객체를 작성 할 수 있음 > 새로운 타입의 객체를 만드는 2가지 방법만 소개 : new Object(), 리터럴 표기법 ex) 은행 계좌를 표현하는 account 객체 자바스크립트 객체 : account owner, code, balance : 프로퍼티 deposit(), withdraw(), inquiry() : 메소드 new Object() account 객체 See the Pen new object account by Nyoung (@dmsud2899) on CodePen. 리터럴 account 객체 See the Pen Literal account by Nyoung (@dmsud2899) on CodePen. 리터럴 account 객체2 : accou.. 더보기
[JavaScript] Date객체_ 방문 초시간에 따라 바뀌는 배경색 Date 객체 > 시간 정보를 담는 객체 > 현재 시간 정보 > var now = now Date(); //현재 날짜와 시간(시, 분, 초) 값으로 초기화된 객체 생성 > 학기 시작일 2020년 9월 1일의 날짜 기억 > var startDady = new Date(2020, 8, 1) //8은 9월을 의미함 Date 객체 활용 함수 설명 .getFullYear() 년도 .getMonth() + 1 월 .getDate() 일 .getHour() 시 .getMinutes() 분 .getSeconds() 초 .getMilliseconds() 밀리초 .toUTCString() GMT 시간 .toLocaleString() 지역 시간 > var now = new Date(); //현재 2020년 9월 1일 저녁 .. 더보기
[JavaScript] 전역함수_ 구구단 출력 자바스크립트에서 제공하는 전역함수 전역 함수명 설명 eval(exp) exp의 자바스크립트 식을 계산 후 결과 리턴 parseInt(str) str 문자열을 10진 정수로 변환하여 리턴 parseInt(str, radix) str 문자열을 radix 진수로 해석 후, 10진 정수로 바꿔 리턴 parseFloat(str) str 문자열을 실수로 바꾸어 리턴 isFinite(value) value가 숫자이면 true 리턴 isNaN(value value가 숫가가 아니면 true 리턴 구구단 출력 See the Pen 구구단출력 by Nyoung (@dmsud2899) on CodePen. 참고 더보기
[JavaScript]switch문으로 커피 주문하기 조건문 if-else문 > 값이 true이면 if, else if 조건 실행 > 값이 false면 else 조건 실행 swtich문 > 값에 따라 서로 다른 코드를 실행할 때 swtich문에서 break문 > break문을 만날 때 까지 switch문 실행 후 break문을 만나면 종료 See the Pen YzGqEzG by Nyoung (@dmsud2899) on CodePen. 참고 더보기
[JavaScript] Math객체 활용_랜덤 구구단 만들기 Math > 수학 계산을 위한 프로퍼티(속성)과 메소드를 제공함 > new Math()로 객체를 새로 생성하지 않고 사용함 > Math.sqrt(m) : m의 제곱근 -> var sq = Math.sqrt(4) : 4의 제곱근 = 2 > Math.PI : 파이 값 -> var area = Math.PI*2*2 : 반지름이 2인 원의 면적 난수 발생 > Math.random() : 0이상 1미만의 랜덤 실수 리턴 > Math.floor(m) : m의 소수점 이하를 제거한 정수를 리턴 > Math.random()*9) : 0~9까지의 정수를 리턴 > Math.random()*9 : 1~0까지의 정수를 리턴 See the Pen PoqQNXz by jaybon (@jaybon1) on CodePen. docu.. 더보기
[JavaScript]쿠키 생성 및 사용 쿠키란? > 웹서버에서 브라우저에게 지시함. > 사용자 로컬 컴퓨터에 4k 이하의 작은 데이터를 저장하는 것을 > 즉, 웹서버와 사용자 브라우저 간의 정보 공유 > 예를 들어, 크롬에서 모든 사용자의 개인정보(자동로그인을 위한)를 웹서버내에 저장하지 않고 사용자의 쿠키에 저장하도록 하는 것. 쿠키의 도입 배경 > HTTP의 약점을 보안하기 위함 > 웹서버와 브라우저 사이의 통신은 무상태 프로토콜임 > 무상태 프로토콜이란 바로 이전 요청과 현재 요청이 연결되어 있음을 기억하지 않음 > 즉, 정보 입력 후 새로고침하면 해당 웹서버에서 내 정보를 기억하지 못하기 때문에 다시 정보를 입력해야 하는 것. > 이 같은 HTTP의 무상태 프로토콜 약점을 보완하고자 쿠키 등장 쿠키의 생성 > 쿠키는 웹서버가 생성하여 .. 더보기