객체와 객체지향 프로그래밍

배열과 자바스크립트 객체의 다른점

  • 배열은 값을 가지며 각 값에는 숫자형 인덱스가 있음.
  • 객체는 프로퍼티를 가지며, 프로퍼티는 키와 값을로 구성.
  • 배열은 순서가 있지만 객체에는 없음

객체의 가장 큰 특징은 키를 통해 프로퍼티에 접근 할 수 있다는 점

프로퍼티의 나열

객체 프로퍼티에는 순서가 없음

for…in

객체 프로퍼티 나열할 때…

1
2
3
4
5
6
7
8
9
10
const obj = Symbol();
const o = {a:1, b:2, c:3, [obj]:4};
for(let prop in o){
if(!o.hasOwnProperty(prop)) continue;
console.log(`${prop}: ${o[prop]}`);
}
//a: 1
//b: 2
//c: 3

for...in 루프에는 키가 심볼인 프로퍼티는 포함되지 않음
(obj는 Symbol()로 되어 있음)

Object.keys

Object.keys는 객체에서 나열 가능한 문자열 프로퍼티를 배열로 반환

1
2
3
4
5
6
7
const SYM = Symbol();
const o = {a:1, b:2, c:3, [SYM]:4};
Object.keys(o).forEach(prop=>console.log(`${prop}: ${o[prop]}`));
//a: 1
//b: 2
//c: 3

객체의 프로퍼티 키를 배열로 가져와야 할 때는 Object.keys가 편함
예를 들어 객체에서 x로 시작하는 프로퍼티를 모두 가져온다면 다음과 같이 할 수 있음

1
2
3
4
5
const o = {apple:1, xochitl:2, balloon:3, guitar:4, xylophone:5};
Object.keys(o).filter(prop=>prop.match(/^x/)).forEach(prop=>console.log(`${prop}: ${o[prop]}`));
//xochitl: 2
//xylophone: 5

프로토타입

클래스의 인스턴스에서 사용할 수 있는 메서드 = 프로토타입
예를들어 car의 인스턴스에서 사용할 수 있는 shift메서드는 프로토타입 메서드.

프로토타입 메서드는 Car.prototype.shit처럼 표기할 때가 많음.
최근에는 프로토타입 메서드를 #으로 표시하는 표기법이 쓰임.
Car.protoptype.shift를 Car#shift로 씀. 또한 객체 생성자, 즉 클래스는 Car처럼 항상 첫 글자를 대문자로 표기.

공유하기 댓글