[Javascript] 객체(Object)

1. 객체(Object)

---

자바스크립트는 객체 기반의 스크립트 언어이며 자바스크립트는 거의 모든 것이 객체로 이루어져있다. 원시 타입을 제외한 나머지 값들(함수, 배열, 정규 표현식 등)은 모두 객체이다. 자바스크립트의 객체는 키(key)와 값(value)으로 구성된 프로퍼티(Property)들의 집합이다. 프로퍼티의 값으로 자바스크립트에서 사용할 수 있는 모든 값을 사용할 수 있다. 자바스크립트의 함수는 일급 객체이므로 값으로 취급할 수 있다.

일급 객체란?
1. 모든 일급 객체는 변수에 담을 수 있다.
2. 모든 일급 객체는 인자(parameter)로 전달할 수 있다.
3. 모든 일급 객체는 다른 함수의 반환 값으로 반환될 수 있다.

1.1 프로퍼티

프로퍼티는 프로퍼티 키와 프로퍼티의 값으로 구성된다. 프로퍼티는 프로퍼티 키로 유일하게 식별할 수 있다. 프로퍼티 키의 명명 규칙과 프로퍼티 값으로 사용할 수 있는 값은 다음과 같다.

• 프로퍼티 키 : 빈 문자열을 포함하는 모든 문자열 또는 symbol 값
• 프로퍼티 값 : 모든 값

프로퍼티 키에 문자열이나 symbol 값 이외의 값을 지정하면 암묵적으로 타입이 변환되어 문자열이 된다. 이미 존재하는 프로퍼티 키를 중복 선언하면 나중에 선언한 프로퍼티가 먼저 선언한 프로퍼티를 덮어쓴다. 배열과 달리 객체는 프로퍼티를 열거할 때 순서를 보장하지 않는다.

1.2 메소드

프로퍼티의 값이 함수일 경우, 일반 함수와 구분하기 위해 메소드라고 부른다. 즉, 메소드는 객체에 제한되어 있는 함수를 의미한다.

 

2. 객체(Object) 생성 방법

---

2.1 객체 리터럴

가장 일반적인 자바스크립트의 객체 생성 방식이다. 중괄호 {}를 사용하여 객체를 생성하는데 중괄호 내에 1개 이상의 프로퍼티를 기술하면 해당 프로퍼티가 추가된 객체를 생성할 수 있다. 중괄호 내에 아무것도 기술하지 않으면 빈 객체가 생성된다.

var obj = {};
console.log(typeof obj); // object

var person = {
  name: 'kim',
  gender: 'male',
  sayHello: function () {
    console.log("hello!");
  }
};

2.2 Object 생성자 함수

new 연산자와 Object 생성자 함수를 호출하여 빈 객체를 생성할 수 있다. 빈 객체 생성 이후 프로퍼티 또는 메소드를 추가하여 객체를 완성하는 방식이다. 생성자(constructor) 함수란 new 키워드와 함께 객체를 생성하고 초기화하는 함수를 의미한다.

var person = new Object();

// 프로퍼티 추가
person.name = 'kim';
person.gender = 'male';
person.sayHello = function () {
  console.log("hello!");
};

 

3. 객체(Object) 프로퍼티 접근

---

3.1 프로퍼티 키

프로퍼티 키는 일반적으로 문자열을 지정한다. 프로퍼티 키에 문자열이나 symbol 값 이외의 값을 지정하면 암묵적으로 타입이 변환되어 문자열이 된다. 프로퍼티의 키는 문자열이므로 따옴표를 사용한다. 프로퍼티 값은 모든 값과 표현식이 올 수 있으며 프로퍼티의 값이 함수인 경우 이를 메소드(method)라고 부른다.

var person = {
  'name': 'kim',
  gender: 'male',
  1: 10,
};

3.2 프로퍼티 값 읽기

객체의 프로퍼티 값에 접근하는 방법은 마침표(.) 표기법과 대괄호([]) 표기법이 있다.

var person = {
  'name': 'kim',
  gender: 'male',
  1: 10
};

console.log(person['name']);  // 'kim'
console.log(person.gender);  // 'male'

프로퍼티 키가 유효한 자바스크립트 이름이고 예약어가 아닌 경우 프로퍼티 값은 마침표 표기법, 대괄호 표기법 모두 사용할 수 있다. 프로퍼티 이름이 유효한 자바스크립트 이름이 아니거나 예약어인 경우 프로퍼티 값은 대괄호 표기법으로 읽어야 한다. 대괄호([]) 표기법을 사용하는 경우, 대괄호 내에 들어가는 프로퍼티 이름은 반드시 문자열이어야 한다. 객체에 존재하지 않는 프로퍼티를 참조하면 undefined를 반환한다.

3.3 프로퍼티 동적 생성

객체가 소유하고 있지 않은 프로퍼티 키에 값을 할당하면 주어진 키와 값으로 프로퍼티를 생성하여 객체에 추가한다. 점 표기법으로 접근이 동적 생성이 가능하다.

var person = {
  'name': 'kim',
  gender: 'male',
  1: 10
};

person.age = 25;

3.4 프로퍼티 삭제

자바스크립트에서는 프로퍼티에 undefined와 null을 대입한다고 해도 프로퍼티가 삭제되는 것이 아니다. delete 연산자를 사용하여 객체의 프로퍼티를 삭제할 수 있다. 이때 피연산자는 프로퍼티 키어야 한다.

var person = {
  'name': 'kim',
  gender: 'male',
  1: 10
};

delete person.gender;

 

4. Pass-by-Reference & Pass-by-Value

---

Object type을 객체 타입 또는 참조 타입이라고 한다. 참조 타입이란 객체의 모든 연산이 실제값이 아닌 참조값으로 처리됨을 의미한다. 원시 타입은 값이 한 번 정해지면 변경이 불가능하지만, 객체는 프로퍼티를 변경, 삭제, 추가가 가능하므로 변경 가능한 타입이라고 할 수 있다. 따라서 객체 타입은 동적으로 변화할 수 있으므로 어느 정도의 메모리 공간을 확보해야 하는지 예측할 수 없기 떄문에 메모리 공간을 확보하고 메모리의 힙 영역에 저장된다. 

 

원시 타입은 값(value)으로 전달된다. 즉, 값이 복사되어 전달된다. 이를 pass-by-value(값에 의한 전달)라고 한다. 원시 타입은 값이 한 번 정해지면 변경이 불가능하고, 이들 값은 런타임(변수 할당 시점)에 메모리의 스택 영역에 고정된 메모리 영역을 점유하고 저장된다.