자바스크립트 객체

객체란 이름이 있는 값을 의미한다. 

객체의 값은 단일 값일 수도 있으며, 

객체의 여러 가지의 값을 담고 있을 수도 있다. 

// 단일 값 예시

var object = 1;

// 복수의 값을 담고 있는 예시 

var object1 = {};

object1.living = 'seoul';

object1.age = 20;

객체를 생성하는 방법은 여러가지다.

우선 생성자 함수를 활용하여 객체를 생성하는 방법을 살펴보자. 

생성자 함수란 미리 객체의 틀(형태)을 만들고 필요할 때 마다 호출하여 

특정한 틀을 갖추고 있는 객체를 반환하는 방식이다. 

var Person = function() {

this.living = 'seoul';

this.age = 20;

}

var person = new Person();

console.log(person); // Person {living: "seoul", age: 20}

var person1 = new Person(); 

console.log(person1); // Person {living: "seoul", age: 20}

위의 예제를 통해 볼 수 있듯이,

Person 생성자 함수를 사용하면 

living 값이 seoul이고, age 값이 20인 객체를 손쉽게 만들 수 있다. 

생성자 함수로 생성한 변수의 경우의 특징으로는 

constructor라는 속성이 자동으로 추가된다는 것이다. 

constructor는 어떤 생성자 함수를 이용해서 해당 객체가 생성되었는지 보여주는 속성이다. 

constructor와 관련해서는 추후에 자세히 정리하겠다. 

간단하게 리터럴한 방법으로 생성할 수 있다. 

(리터럴한 방법이란, 객체의 생성자 함수를 사용하지 않고 생성하는 방법을 의미한다.)

다음은 빈 값을 갖고 있는 객체를 생성하는 예제다.

var obj = Object(); // Object 함수 이용해서 리터럴하게 생성하기

var obj1 = {}; // 리터럴하게 생성

다음은 숫자 10을 값으로 갖고 있는 객체를 생성하는 예제다. 

var num1 = Number(10); // Number 함수를 이용해서 리터럴하게 생성하기

var num2 = 10; // 리터럴하게 생성하기

다음은 'javascript' 값을 갖고 있는 객체를 생성하는 예제다. 

var str1 = String('javascript'); // String 함수 이용해서 리터럴하게 생성하기

var str2 = 'javascript'; // 리터럴하게 생성하기

위의 값들은 생성한 방식은 다르나,

동일한 값이 대입되어 있다. 

그렇다면 단순 값을 대입한 것과

생성자 함수를 이용해서 생성한 객체는 동일할까?

var number = new Number(10);

var number1 = 10;

console.log(number);  // Number {[[PrimitiveValue]]: 10}__proto__: Number[[PrimitiveValue]]: 10 

console.log(number1); // 10

위의 예시에서 확인할 수 있듯이 단순 값(원시 값)이 대입된 경우

Number 타입의 객체가 아니다. 

하지만, 특정 타입의 객체가 아니어도 객체처럼 사용할 수 있다. 

즉, 원시 값을 객체처럼 사용하면 객체처럼 동작한다. 

number.toString(); // "10"

number1.toString(); // "10"