[JavaScript] 내장 객체와 브라우저 객체

kim unknown·2022년 4월 12일
0

JavaScript

목록 보기
5/22
post-thumbnail

1. 내장 객체

내장 객체(Built-in Object)란 브라우저의 자바스크립트 엔진에 내장된 객체를 말한다. 필요한 경우 객체를 생성해서 사용할 수 있으며, 내장 객체로는 문자, 날짜, 배열, 수학, 정규 표현 객체 등이 있다.

내장 객체 생성하기
참조 변수(인스턴스 이름) = new 생성 함수()


1-1. 날짜 객체(Date Object)

날짜 객체는 날짜나 시간 관련 정보를 제공한다.

- 날짜 정보를 가져올 때(GET)
getFullYear() : 연도를 가져옴
getMonth() : 월을 가져옴 (1월:0 ~ 12월:11)
getDate() : 일을 가져옴
getDay() : 요일을 가져옴 (일:0 ~ 토:6)
getHours() : 시를 가져옴
getMinutes() : 분을 가져옴
getSeconds() : 초를 가져옴
getMilliseconds() : 밀리초를 가져옴 (1/1.000초 단위)
getTime() : 1970년 1월 1일부터 경과된 시간을 밀리초로 표기
toGMTString() : GMT 표준 표기 방식으로 문자형 데이터로 반환

- 날짜 정보를 수정할 때(SET)
setFullYear() : 연도 수정
setMonth() : 월 수정 (1월:0 ~ 12월:11)
setDate() : 일 수정
요일은 날짜를 바꾸면 자동으로 바뀌므로 setDay()는 없음.
setHours() : 시 수정
setMinutes() : 분 수정
setSeconds() : 초 수정
setMilliseconds() : 밀리초 수정
setTime() : 1970년 1월 1일부터 경과된 시간을 밀리초로 수정
toLocaleString() : 운영 시스템 표기 방싣으로 문자형 데이터로 반환


1-2. 수학 객체(Math Object)

수학 객체는 수학과 관련된 기능과 속성을 제공한다.

Math.abs() : 숫자의 절댓값 반환
Math.max() : 가장 큰 값 반환
Math.min() : 가장 작은 값 반환
Math.pow() : 숫자의 거듭제곱값 반환
Math.random() : 0~1 사이의 난수 반환
Math.round() : 소수점 이하를 반올림하여 반환
Math.ceil() : 소수점 이하를 올림하여 반환
Math.floor() : 소수점 이하를 내림하여 반환
Math.sqrt() : 숫자의 제곱근을 반환
Math.PI() : 원주율 상수 반환


1-3. 배열 객체(Array Object)

배열 객체는 배열의 순서를 바꾸거나 삽입, 삭제등을 할 수 있는 메서드와 속성을 제공한다.

join(연결문자) : 문자를 연결하여 1개의 문자열로 반환
reverse() : 배열의 데이터 순서를 거꾸로 바꾼 후 반환
sort() : 배열의 데이터를 오름차순으로 정렬
slice(index1, index2) : 배열의 데이터 중 원하는 인덱스 구간만큼 잘라서 가져옴
splice() : 배열의 데이터를 수정. 특정 위치의 데이터를 제거하거나 삽입
concat() : 2개의 배열 객체를 하나로 결합
pop() : 배열의 마지막 인덱스에 저장된 데이터 삭제
push(new data) : 배열의 마지막 인덱스에 새 데이터 삽입
shift() : 배열의 첫 번째 인덱스에 저장된 데이터 삭제
unshift(new data) : 배열의 첫 번째 인덱스에 새 데이터 삽입
length : 배열에 저장된 총 데이터의 개수 반환


1-4. 문자열 객체(String Object)

문자열 객체는 문자형 데이처를 객체로 취급하는 것으로, 문자와 관련된 메서드와 속성을 제공한다.

charAt(index) : 문자열에서 인덱스 번호에 해당하는 문자를 반환
indexOf("찾을 문자") : 문자열에서 왼쪽부터 '찾을 문자'와 제일 먼저 일치하는 문자를 찾아 인덱스 번호 반환
lastIndexOf("찾을 문자") : 문자열에서 오른쪽부터 '찾을 문자'와 제일 먼저 일치하는 문자를 찾아 인덱스 번호 반환
match("찾을 문자") : 문자열에서 왼쪽부터 '찾을 문자'와 제일 먼저 일치하는 문자를 찾아 반환. 만일 찾는 문자가 없다면 null 반환
replace("바꿀 문자", "새 문자") : 문자열에서 왼쪽부터 '바꿀 문자'와 일치하는 문자를 찾아 제일 먼저 찾은 문자를 '새 문자'로 치환
search("찾을 문자") : 문자열에서 왼쪽부터 '찾을 문자'와 일치하는 문자를 찾아 제일 먼저 일치하는 인덱스 번호를 반환
slice(a,b) : a개의 문자를 자르고 b번째 이후 문자를 자른 후 남은 문자를 반환
substring(a,b) : a 인덱스부터 b 인덱스 이전 구간의 문자를 반환
substr(a, 문자 개수) : 문자열에 a 인덱스부터 지정한 문자 개수만큼 문자열 반환
split("문자") : 지정한 문자를 기준으로 문자 데이터를 나누어 배열에 저장하여 반환
toLowerCase() : 문자열에서 영문 대문자를 모두 소문자로 변경
toUpperCase() : 문자열에서 영문 소문자를 모두 대문자로 변경
length : 문자열에서 문자의 개수 반환
concat("새로운 문자") : 문자열에서 새로운 문자열을 결합
charCodeAt(index) : 문자열 index에 해당 문자의 아스키 코드 값을 반환
fromCharCode(아스키 코 드값) : 아스키 코드 값에 해당하는 문자를 반환
trim() : 문자의 앞 또는 뒤에 공백 문자열을 삭제


2. 브라우저 객체(BOM)

브라우저에 내장된 객체를 브라우저 객체라 한다. 계층적 구조로 이루어져 있으며, 이를 브라우저 객체 모델(BOM, Browser Object Model)이라 한다.


2-1. window 객체

* 브라우저에 내장된 객체를 브라우저 객체라 하며, window는 브라우저 객체의 최상위 객체이다.

open("URL", "새 창 이름", "새 창 옵션") : URL 페이지를 새 창으로 나타냄
alert(data) : 경고창을 나타내고 데이터를 보여줌
prompt("질문", "답변") : 질문과 답변으로 질의응답 창을 나타냄
confirm("질문 내용") : 질문 내용으로 확인이나 취소 창을 나타냄. 확인을 누르면 true, 취소를 누르면 false를 반환
moveTo(x,y) : 지정한 새 창의 위치를 이동
resizeTo(width, height) : 지정한 새 창의 크기를 변경
setInterval(function() {자바스크립트 코드}, 일정 시간 간격) : 지속적으로 일정한 시간 간격으로 함수를 호출하여 코드를 실행
setTimeout(function() {자바스크립트 코드}, 일정 시간 간격) : 단 한 번 일정한 간격으로 함수를 호출하여 코드를 실행


2-2. screen 객체

screen 객체는 사용자의 모니터 정보를 제공하는 객체이다.

screen.width : 화면의 너비값을 반환
screen.height : 화면의 높이값을 반환
screen.availWidth : 작업표시줄을 제외한 화면의 너비값을 반환
screen.availHeight : 작업표시줄을 제외한 화면의 높이값을 반환
screen.colorDepth : 사용자 모니터가 표현 가능한 컬러 bit를 반환


2-3. location 객체

location 객체는 사용자 브라우저와 관련된 속성과 메소드를 제공하는 객체이다.

location.href : 주소 영역의 참조 주소를 설정하거나 URL을 반환
location.hash : URL의 해시값을 반환
location.hostname : URL의 호스트 이름을 설정하거나 반환
location.host : URL의 호스트 이름과 포트 번호를 반환
location.protocol : URL의 프로토콜을 반환
location.search : URL의 쿼리(요청값)를 반환
location.reload : 새로 고침


2-4. history 객체

history 객체는 사용자가 방문한 사이트의 기록을 남기고 이전 방문 사이트와 다음 방문 사이트로 다시 돌아갈 수 있는 속성과 메서드를 제공한다.

history.back() : 이전 방문 사이트로 이동
history.forward() : 다음 방문 사이트로 이동
history.go(이동 숫자) : 이동 숫자에 -n을 입력하면 n단계 이전의 방문 사이트로 이동
history.length : 방문 기록에 저장된 목록의 개수를 반환


2-5. navigator 객체

navigator 객체는 현재 방문자가 사용하는 브라우저 정보와 운영체제 정보를 제공하는 객체이다.

navigator.appCodeName : 현재 브라우저의 코드명 반환
navigator.appName : 현재 브라우저의 이름 반환
navigator.appVersion : 현재 브라우저의 버전 정보 반환
navigator.language : 현재 브라우저가 사용하고 있는 언어 반환
navigator.product : 현재 브라우저의 엔진 이름 반환
navigator.platform : 현재 컴퓨터의 운영체제 정보를 제공
navigator.onLine : 온라인 상태 여부에 대한 정보 제공
navigator.userAgent : 브라우저와 운영체제의 종합 정보를 제공

0개의 댓글