# 객체

### 객체&#x20;

> 객체. 메서드( );\
> 객체. 속성; 또는 객체. 속성 =  값;

객체의 메서드를 실행\
객체의 속성값을 가져옵니다.\
객체의 속성값을 바꿉니다.

## 객체의 종류

자바스크립트의 객체는 크게 내장 객체, 브라우저 객체 모델(BOM, Browser Object Model). 문서 객체 모델(DOM, Document Object Model)로 나눌 수 있습니다.

### 내장객체

내장 객체는 자바스크립트 엔진에 내장되어 있어 필요한 경우에 생성해서 사용할 수 있습니다. \
내장 객체로는 문자(String), 날짜(Date), 배열(Array), 수학(Math) 객체 등이 있습니다.

### 브라우저 객체 모델

브라우저 객체 모델(BOM)은 브라우저에 계층 구조로 내장되어 있는 객체를 말합니다.\
브라우저 객체로는 window, screen, location, history, navigator 객체 등이 있습니다.

### 문서 객체 모델

문서 객체 모델(DOM)은 HTML문서 구조를 말합니다.\
문서의 기본 구조는 최상위 객체로 \<html>이 있으며, 그 하위 객체로는 \<head>와 \<body>가 있습니다. 예를 들어 자바스크립트를 이용해 이미지의 src 속성을 바꾸고 싶다면 지정되 \<img>를 선택해 src 속성을 바꿔야합니다. 이때 지정요소를 제대로 선택해서 가져오려면 우선 객체의 구조를 잘 이해하고 있어야 합니다, 이렇게 문서 객체 모델에서는 HTML의 모든 요소들을 문서 객체로 선택하여 자유롭게 속성을 바꿀 수 있고, 선택한 문서 객체에 원하는 스타일(CSS)을 적용할 수도 있습니다.

```javascript
//변수 num1, num2 만들고 100, 200저장한 다음, 출력;
let num1 = 100;
let num2 = 200;

//let num1 = 100, num2 = 200;     //쉼표를 통해서 let 생략가능

document.write(num1, "<br>");
document.write(num2, "<br><br>");

//100
//200
```

```javascript
//배열을 선언하고, 100, 200입력하고 출력
let arr1 = new Array(); 
arr1[0] = 100;
arr1[1] = 200;

document.write(arr1[0], "<br>");
document.write(arr1[1], "<br><br>");

//배열을 선언과 동시에 데이터(100, 200)를 넣고 출력
let arr2 = new Array(100,200);

document.write(arr2[0], "<br>");
document.write(arr2[1], "<br><br>");

//배열을 선언하지 않고 바로 데이터를 입력하고 출력
let arr3 = [100, 200];

document.write(arr3[0], "<br>");
document.write(arr3[1], "<br><br>");

//100
//200

//100
//200

//100
//200
```

```javascript
//객체를 선언하고 첫번째 저장소에 300, 400 입력하고 출력
let obj1 = new Object();

obj1[0] = 300;
obj1[1] = 400;

document.write(obj1[0], "<br>");
document.write(obj1[1], "<br><br>");
//객체이지만 배열처럼 쓸수 있다.

//300
//400
```

```javascript
let obj2 = new Object(300, 400);

document.write(obj2[0], "<br>");
document.write(obj2[1], "<br><br>");

//undefined
//undefined
```

```javascript
let obj3 = {a : 300, b : 400};

document.write(obj3.a, "<br>");
document.write(obj3.b, "<br><br>");

//300
//400
```

```javascript
let obj4 = new Object();
obj4.a = [300, 400];
obj4.b = "javascript";

document.write(obj4.a, "<br>");
document.write(obj4.a[0], "<br>");
document.write(obj4.a[1], "<br>");
document.write(obj4.b, "<br><br>");

//300, 400
//300
//400
//javascript
```

```javascript
let obj5 = {
    a:100, 
    b:"100", 
    c:[100,200], 
    d:function(){
        document.write("객체가 실행되었습니다.");
    }
}

document.write(obj5.a, "<br>");
document.write(obj5.b, "<br>");
document.write(obj5.c[0], "<br>");
document.write(obj5.c[1], "<br>");
document.write(obj5.d, "<br>"); //문자로 인식하여 뒷부분이 출력된다.
obj5.d();

//100
//100
//100
//200
//function(){document.write("객체가 실행되었습니다."); }
//객체가 실행되었습니다.
```

```javascript
let obj4 = {
    a : [100, 200, 300],
    b : "자바스크립트",
    c : function(){
        document.write("실행되었습니다.");
    },
    d : function(){
        document.write(this.b  + "가 실행되었습니다.")
    } 
}

document.write(obj4.a[0]);
document.write(obj4.a[1]);
document.write(obj4.a[2]);
document.write(obj4.b);
obj4.c();
obj4.d();

//100
//200
//300
//
```
