인사이드 자바스크립트 #03 (객체, 프로토타입)

자바스크립트 참조 타입(객체 타입)

자바스크립트에서 숫자, 문자열, 불린값, null, undefined 같은 기본 타입을 제외한 모든 값은 객체다. 따라서 배열, 함수, 정규표현식 등도 모두 결국 자바스크립트 객체로 표현된다. 자바스크립트에서 객체는 단순히 '이름(key):값(value)' 형태의 프로퍼티들을 저장하는 컨테이너로서, 컴퓨터 과학 분야에서 해시Hash라는 자료구조와 상당히 유사하다. 기본타입은 하나의 값만을 가지는데 비해, 참조 타입인 객체는 여러개의 프로퍼티들을 포함할 수 있으며, 이러한 객체의 프로퍼티는 기본 타입의 값을 포함하거나 다른 객체를 가리킬 수 도 있다. 이러한 프로퍼티의 성질에 따라 객체의 프로퍼티는 함수로 포함할 수 있으며, 자바스크립트에서는 이러한 프로퍼티를 메서드라고 부른다.

 

---

객체 생성

1. 기본제공 Object() 객체 생성자 함수
2. 객체 리터럴(표기법 { } )
3. 생성자 함수 

---

객체 프로퍼티 읽기/쓰기/갱신

객체는 새로운 값을 가진 프로퍼티를 생성하고, 해당 값을 읽거나 원하는 값으로 갱신할 수 있다.

 

객체 프로퍼티 접근 방법

1. 대괄호 ([ ]) 표기법 ( 주의:접근하려는 프로퍼티 이름을 문자열 형태로 만들어야 함 foo['name'] )
   ※ foo[name]이라고 접근하면 undefined 값이 출력되는 이유?
   자바스크립트에서는 대괄호 표기법에서 접근하려는 프로퍼티 이름을 문자열 형태로 만들지 않으면 모든 자바스크립트 객체에서 호출 가능한 toString() 이라는 메서드를 자동으로 호출해서 이를 문자열로 바꾸려는 시도를 한다.
   (만약 객체에 없는 프로퍼트에 접근하는 경우는 undefined 값이 출력된다.)
2. 마침표 (.) 표기법

프로퍼티 동적 생성

자바스크립트 객체의 프로퍼티에 값을 할당할 때, 프로퍼티가 이미 있을 경우는 해당 프로퍼티의 값이 갱신되지만, 객체의 해당 프로퍼티가 없을 경우에는 새로운 프로퍼티가 동적으로 생성된 후 값이 할당된다

 

대괄호 표기법만을 사용해야 하는 경우

접근하려는 프로퍼티가 표현식이거나 예약어일 경우

▷ 프로퍼티가 'full-name' 일 때, '-' 연산자는 있는 표현식이기 때문에 대괄호 표현식만을 이용해 foo['full-name'] 형태로 접근

 

NaN (Not a Number) 값

자바스크립트에서 수치 연산을 해서 정상적인 값을 얻지 못할 때 출력되는 값이다 

▷ 1 - 'hello' 와 같은 연산의 결과는 NaN이다

 

---

객체 프로퍼티 삭제

자바스크립트에서는 객체의 프로퍼티를 delete 연산자를 이용해 즉시 삭제할 수 있다. 주의할 점은 delete 연산자는 객체의 프로퍼티를 삭제할 뿐, 객체 자체를 삭제하지는 못한다는 것이다.

 

---

참조 타입의 특성

자바스크립트에서는 기본 타입인 숫자, 문자열, 불린값, null, undefined 5가지를 제외한 모든 값은 객체다. 배열이나 함수 또한 객체로 취급된다. 그리고 이러한 객체는 자바스크립트에서 참조타입이라고 부른다. 이것은 객체의 모든 연산이 실제 값이 아닌 참조값으로 처리되기 때문이다. 

 

---

객체 비교

동등 연산자 (==)를 사용하여 두 객체를 비교할 때도 객체의 프로퍼티값이 아닌 참조값을 비교한다. 

 

---

참조에 의한 함수 호출 방식

• 기본타입 - 값에 의한 호출 Call By Value : 함수를 호출할 때 인자로 기본 타입의 값을 넘길 경우, 호출된 함수의 매개변수로 복사된 값이 전달된다. 때문에 함수 내부에서 매개변수를 이용해 값을 변경해도 실제로 호출된 변수의 값이 변경되지는 않는다. 
• 객체와 같은 참조 타입의 경우 - 참조에 의한 호출 Call By Reference : 함수를 호출할 때 인자로 참조 타입인 객체를 전달할 경우, 객체의 프로퍼티값이 함수의 매개변수로 복사되지 않고, 인자로 넘긴 객체의 참조값이 그대로 함수 내부로 전달된다. 때문에 함수 내부에서 참조값을 이용해서 인자로 넘긴 실제 객체의 값을 변경할 수 있는 것이다.

---

프로토타입

자바스크립트의 모든 객체는 자신의 부모 역할을 하는 객체와 연결되어 있다. 그리고 이것은 마치 객체지향의 상속 개념과 같이 부모 객체의 프로퍼티를 마치 자신의 것처럼 쓸 수 있는 특징이 있다. 이러한 부모객체를 프로토타입 객체 (짧게 프로토타입) 이라고 부른다.