DOM (문서 객체 모델)

HTML 문서의 구조를 가리켜 문서 객체 모델(DOM:Document Object Model)이라고 합니다.

DOM을 배우는 주된 목적은 자바스크립트를 사용하여 문서 객체를 선택하고 속성 또는 스타일(css)을 적용하기 위해서 입니다.

자세히 보기

BOM (브라우저 객체 모델)

브라우저에 내장된 객체를

브라우저 객체(BOM: Browser Object Model)라고 합니다.

window는 브라우저 객체의 최상위 객체 입니다.

window 객체는 여러가지 하위 객체를 포함하고 있습니다.

자세히 보기

RegExp (정규표현) 객체 -JavaScript

정규표현 객체(RegExp)는 입력요소에 데이터를 규칙에 맞게 작성했는지 판단해서 알려주는 객체 입니다.

지정한 규칙대로 단어가 입력됬는지,

잘못된 단어를 포함하고 있는지 찾을때 사용합니다

  • 기본형 두가지

var 변수 = new RegExp(패턴, 검색옵션)

생성자 함수를 사용하면 정규식이 실행 시점에 컴파일됩니다.
정규식의 패턴이 변경될 수 있는 경우,
혹은 사용자 입력과 같이 다른 출처로부터 패턴을 가져와야 하는
경우에는 생성자 함수를 사용합니다.

var 변수 = /패턴/검색 옵션

정규식 리터럴(슬래쉬로 감싸는 패턴)은
스크립트가 불러와질 때 컴파일됩니다.
만약 정규식이 상수라면, 이렇게 사용하는 것이 성능을 향상시킬 수 있습니다.

자세히 보기

String(문자) 객체 -JavaScript


문자 객체 메서드 및 속성

종류 설명
charAt(index) 문자열에서 인덱스 번호에 해당하는 문자를 반환
indexOf(“찾을 문자”) 문자열 왼쪽부터 찾을 문자와 일치하는 문자를 찾아 최초로 일치하는 문자의 인덱스 번호를 반환
lastindexOf(“찾을 문자”) 문자열 오른쪽부터 찾을 문자와 일치하는 문자를 찾아 최초로 일치하는 문자의 인덱스 번호를 반환 (만일 찾을 문자가 없으면 -1을 반환)
match(“찾을 문자”) 문자열 왼쪽부터 찾을 문자와 일치하는 문자를 찾아 최초로 찾은 문자를 반환 (찾는 문자가 없으면 null 반환)
replace(“바꿀 문자”,”새 문자”) 문자열 왼쪽부터 바꿀 문자와 일치하는 문자를 찾아 최초로 찾은 문자를 치환
search(“찾을 문자”) 문자열 왼쪽부터 찾을 문자와 일치하는 문자를 찾아 최초로 일치하는 인덱스 번호 반환
slice(a,b) a번째 까지 문자를 자르고 b번째 이후에 문자를 자른후 남은 문자를 반환
substring(a,b) a 인덱스부터 b 인덱스 이전 구간의 문자를 반환
substr(a,문자 갯수) 문자열에 a인덱스 부터 지정된 문자 개수만큼 문자열을 반환
split(“문자”) 지정한 문자를 기준으로 문자 데이터를 나누어 배열에 저장하여 반환
toLowerCase() 문자열에서 영문 대문자를 모두 소문자로 바꿉니다.
toUpperCase() 문자열에서 영문 소문자를 모두 대문자로 바꿉니다.
length 문자열에서 문자의 총 개수를 반환합니다.
concat(“새로운 문자”) 문자열에 새로운 문자열을 결합합니다.
charCodeAt(“찾을 문자”) 찾을 문자의 아스키 코드 값을 반환
fromCartCode(아스키 코드 값) 아스키 코드 값에 해당하는 문자를 반환
trim() 문자의 앞 또는 뒤에 공백 문자열을 삭제합니다.
자세히 보기

Array(배열) 객체 -JavaScript

여러 개의 데이터를 하나의 저장소에 저장하는 Array(배열) 객체

사용법 3가지

  1. var a =new Array();
    a[0]=30;
    a[1]=”홍길동”;
    a[2]=true;
  2. var b =new Array(30, “홍길동”, true);
  3. var c =[30, “홍길동”, true];
자세히 보기

Math(수학) 객체 -JavaScript

Javascript에서 더하기, 곱하기, 나누기 등등 은 산술연산자를 사용하면 됩니다.

하지만 최댓값, 최솟값, 반올림 값 등은 산술연산자로 구할수 없습니다

수학 객체는 이러한 수학과 관련한 작업을 처리할수 있게 해줍니다.

자세히 보기

Date(날짜) 객체 -JavaScript

날짜 정보를 가져올 때 (GET) 날짜 정보를 수정할 때 (SET)
getFullYear() 연도 정보를 가져옴 setFullYear() 연도 정보만 수정
getMonth() 월 정보를 가져옴(현재 월-1) setMonth() 월 정보만 수정(월-1)
getDate() 일 정보를 가져옴 setDate() 일 정보만 수정
getDay() 요일 정보를 가져옴(일:0~토:6) 요일은 날자를 바꾸면 자동으로바뀌므로 setDate없음
getHours() 시 정보를 가져옴 setHours() 시 정보만 수정
getMinutes() 분 정보를 가져옴 setMinutes() 분 정보만 수정
getSeconds() 초 정보를 가져옴 setSeconds() 초 정보만 수정
getMilliseconds() 밀리초 정보를 가져옴 setMilliseconds() 밀리초 정보만 수정
getTime() 1970년 1월1일부터 경과된 시간을 밀리초로 표기함 setTime() 1970년 1월 1일부터 경과된 시간을 밀리초로 수정
toGMTString(); GMT 표준 표기 방식으로 문자형 데이터로 반환 toLocaleString(); 운영 시스템 표기 방식으로 문자형 데이터로 반환
자세히 보기