Object 객체란?

Object 객체란?

Object 객체는 자바스크립트의 최상위 객체로, 자바스크립트의 가장 기본적인 내장 객체가 Object 객체이다.

아래의 두 가지 방법을 통해 Object 객체를 생성한다.

var object = {};   var object = new Object();

Object 객체에는 총 7가지의 메소드가 있는데 

자바스크립트의 모든 기본 내장 객체는 Object 객체를 기본으로 하여 만들어지며 모든 기본 내장 객체에는 

이 7가지의 메소드가 함께 존재한다.

그러므로 다른 객체에 Object 객체의 메소드를 사용하더라도 적용이 가능하다.

Object 객체에 있는 메서드를 정리해봤다.

메서드 이름	설명
constructor()	객체의 생성자 함수를 나타냅니다.
hasOwnProperty(name)	객체가 name 속성을 가지고 있는지 확인합니다.
isPrototypeOf(object)	객체가 object의 프로토타입인지 검사합니다.
propertyIsEnumerable(name)	반복문을 사용해 열거할 수 있는지 확인합니다.
toLocaleString()	객체를 호스트 환경에 맞는 언어의 문자열로 바꿉니다.
toString()	객체를 문자열로 바꿉니다.
valueOf()	객체의 값을 나타냅니다.

Object 객체에 있는 메소드를 자주 사용하진 않지만 몇가지 살펴보면,

1. hasOwnProperty() 메서드와 propertyIsEnumerable() 메서드

<script>    // 변수 선언    var object = { property: 273 };    // 출력    var output = '';    output += "HOP('property'): " + object.hasOwnProperty('property') + '\n';    output += "HOP('constructor'): " + object.hasOwnProperty('constructor') + '\n';    output += "PIE('property'): " + object.propertyIsEnumerable('property') + '\n';    output += "PIE('constructor'): " + object.propertyIsEnumerable('constructor');    alert(output);    // for in 반복문 사용    for (var key in object) {        alert(object[key]);    } </script>

위 코드를 실행하면 property 속성을 검사한 것은 모두 true를 출력하고 constructor 속성을 검사한 것은 모두 false를 출력한다. propertyIsEnumerable() 메서드를 true로 가지는 속성만 for in 반복문으로 출력한다.

2. toString() 메서드

<script>    // 변수 선언    var object = new Object();    // 출력    alert(object);    alert(object.toString()); </script>

위 코드를 실행하면 두 출력 결과가 같다. toString() 메서드는 객체를 문자열로 변환할 때 자동으로 호출되기 때문이다.

아래 코드에서 student 객체를 만들고 코드 내부에 toString() 메서드를 재선언해 보았다.

<script>    // 변수 선언    var student = {        name: '송중기',        grade: '대학교 2학년',        // toString() 메서드 선언       toString : function () {                  return this.name + ' : ' + this.grade;       }    };    // 출력    alert(student); </script>

자바스크립트는 객체를 문자열로 변환할 때 자동으로 toString() 메서드를 호출한다고 했으므로 다음과 같이 출력된다.

3. constructor() 메서드

constructor() 메서드는 객체의 생성자 함수를 의미하고 자료형을 검사할 때 유용하게 사용할 수 있다.

" 자료형을 검사할 때는 typeof 연산자를 사용하잖아요? "

typeof 연산자를 사용해 자료형을 검사하면 문제가 발생할 수 있는 부분이 아주 조금 있는데 그 문제점은 아래 코드를 출력해보면 알수 있다.

typeof 연산자를 사용해 두 변수의 자료형을 출력해 본다.

<script>    // 변수 선언    var numberFromLiteral = 273;    var numberFromObject = new Number(273);    // 출력    var output = '';    output += '1. ' + typeof (numberFromLiteral) + '\n';    output += '2. ' + typeof (numberFromObject);    alert(output); </script>

이러한 특성으로 인해 자료형 검사에 문제가 발생한다. 다른 방법으로 typeof 연산자 자료형을 비교해보자.

<script>    // 변수 선언    var numberFromLiteral = 273;    var numberFromObject = new Number(273);    // 자료형 확인    if (typeof (numberFromLiteral) == 'number') {        alert('numberFromLiteral은 숫자입니다.');    }    if (typeof (numberFromObject) == 'number') {        alert('numberFromObject는 숫자입니다.');    } </script>

두 변수 모두 숫자지만 생성자 함수를 사용해서 만든 숫자는 객체(Object)이므로 경고창을 출력하지 않는것을 확인할수있다. 

이러한 두 대상을 같은 자료형으로 취급하고 싶을 때는 constructor() 메서드를 사용해야 한다.

<script>    // 변수 선언    var numberFromLiteral = 273;    var numberFromObject = new Number(273);    // 자료형 확인    if (numberFromLiteral.constructor == Number) {        alert('numberFromLiteral은 숫자입니다.');    }    if (numberFromObject.constructor == Number) {        alert('numberFromObject는 숫자입니다.');    } </script>

constructor() 메서드를 사용하면 객체의 생성자 함수가 Number 생성자 함수인지 비교하면 쉽게 숫자인지 구분할 수 있다. 

다른 자료형도 마찬가지이므로 꼭 기억하자!!