자바스크립트 자료형 객체에 대해 자세히 알아보겠습니다.
06 - 1 객체란?
<객체 예시>
var book = {
title : "자바스크립트", //제목
author : "홍길동", //저자
pages : 500, //쪽수
price : 15000 //가격
}
자바스크립트에서 객체는 자료를 저장하고 처리하는 기본 단위 입니다.
자바스크립트의 자료형을 설명할 때 복합 자료형이라는 객체로 설명을 합니다.
여기서 복합 자료형이라 부르는 이유는 숫자, 문자열 등 여러 가지 자료형이 포함되기 때문입니다.
위에 예시처럼 book이라는 객체 안에 문자, 숫자 등 여러 가지 정보가 들어가기 때문에
웹 사이트나 애플리케이션 안에서 여러 자료를 다룰 때 사용합니다.
#1 객체의 종류
1. 내장 객체
자바스크립트에서 자주 사용하는 요소는 이미 객체로 정의되어 있는데,
이를 내장 객체(Bulid-in Object)라고 합니다.
ex) Number, Boolean, Array, Math 등
2. 문서 객체 모델(DOM)
객체를 사용해 웹 문서를 관리하는 방식을 문서 객체 모델(DOM)라고 합니다.
ex) Image 객체, Document 객체
3. 브라우저 객체 모델
웹 문서를 관리하는 것이 문서 객체 모델이라면,
웹 브라우저 정보를 객체로 다루는 것을 브라우저 객체 모델이라고 합니다.
<브라우저 객체 모델 예시>
Navigator 객체 : 사용중인 브라우저 종류나 버전을 담고 있는 객체
History 객체 : 브라우저에서 방문한 기록을 남기는 객체
Location 객체 : 주소 표시줄 정보를 담고 있는 객체
Screen 객체 : 화면 크기 정보가 들어 있는 객체
4. 사용자 정의 객체
사용자가 필요할 때마다 자신의 객체를 정의해서 사용할 수 있는데,
이걸 사용자 정의 객체라고 합니다.
#2 객체의 속성
navigator.vendor
=> navigator 객체의 vendor 속성
객체에서 값을 담고 있는 정보를 속성(Property)라고 합니다.
객체의 속성 값을 가져올 때는 객체 이름 뒤에 마침표(.)를 찍고 그 뒤에 속성 이름을 적습니다.
#3 메서드
콘솔창에 window 객체를 입력하면 그 안에 들어있는 요소들이 모두 표시가 되는데요.
alert : f alert()
=> f alert() : alert() 함수
이렇게 객체 안에 정의된 함수를 메서드(Method)라고 합니다.
이처럼 자바스크립트 객체 안에는 다양한 속성과 함수가 있고
이 속성과 함수로 프로그래밍을 하면 프로그램이 만들어지는 것 입니다.
#4 객체의 프로토타입과 인스턴스
예를 들어 웹 문서에 있는 이미지를 자바스크립트에서 다룰 때는
문서 객체 모델 Image 객체를 사용합니다.
Image객체가 가진 모든 속성과 기능은 웹 이미지를 만들기 위한 기본 틀인데요.
이를 프로토타입(Prototype)이라고 합니다.
만약 웹 문서에 3개의 이미지를 넣는다면
Images 객체를 사용하여 똑같은 객체 3개를 만들고
그 안에 원하는 이미지를 담으면 되는데요.
이처럼 프로토타입을 사용해 만들어낸 객체를 인스턴스(Instance)라고 합니다.
① new 예약어로 Date 객체의 인스턴스 만들기
② now 변수에 저장
#5 내장 객체로 무작위 수 프로그램 만들기
무작위 수 프로그램을 만들기 위해서는 Math 객체를 사용해야 합니다.
Math 객체 : 삼각 함수나 로그 함수를 비롯한 수학 연산 함수를 가지고 있는 내장 객체
0부터 1까지 무작위 수 반환
* random() : 0과 1 사이의 무작위 수를 반환하는 함수
1부터 10까지 무작위 수 반환
1부터 100까지 무작위 정수 반환
* floor() : 숫자의 소수점 이하는 버리는 함수