[JavaScript]객체(Object)

자바스크립트에서도 객체를 다룰 수 있다. 그런데 먼저 자바를 배우고 자바스크립트로 넘어온 클래스의 개념이 존재하지 않기 때문에 개념이 생소할 수도 있다. 따라서 이 부분을 간단하게 정리하고 넘어간다.

자바스크립트는 프로토타입 기반언어 객체지향 언어라는 것을 알아두고 이 글을 읽어보자.

객체(Object)

자바스크립트에서 객체는 속성의 집합으로 볼 수 있다. 위 그림에서 보면, userInfo라는 객체는 userId, userPw, old라는 속성을 가지고 있다. 이렇게 객체로 묶어서 데이터를 다루게 되면 아래와 같은 장점이 있다.

1. 관련있는 데이터를 묶어서 처리할 수 있기 때문에 코드의 유지보수성이 좋아진다.

2. 실세계의 사고방식과 유사한 코딩이 가능하게 한다. 즉 컴퓨터 친화적인 코드를 인간에 가까운 형태로 표현이 가능해 진다는 것이다.

이러한 이유로 객체를 사용해야할 이유는 분명하다. 자바스크립트의 객체는 객체지향 언어들을 흉내낸 정도이지만, 기본적인 룰은 동일하다.

생성

var userInfo = {
    userId: "hyoje420",
    userPw: "1234",
    name: "윤효재",
    age: 25,
    phone: "01037533961",
    introduce: "안녕하세요 저는 윤효재입니다!",
    old: function() {
        this.age++;
    }
};

기본적인 생성 방식은 참조변수를 선언하고 객체 내부에 속성과 속성값을 명시해 주는 것이다. 속성:속성값의 기본형식을 따른다. 이렇게 선언하는 것을 객체 리터럴 형식이라고 한다. 이 객체는 오직 하나만 존재한다. 필요에 의해서 단 하나만의 객체를 생성하는 것을 싱글톤 패턴(Singleton Pattern)이라고 하는데, 위와 같이 생성하면 오직 하나의 객체만 생성된다.

var userInfo는 실제 객체를 담고 있는 것이 아니라 객체를 가리키는 리모컨의 역할을 한다. 따라서 실제 객체는 메모리의 일정 부분에 저장되어 있고, 참조변수를 통해서 메모리에 존재하는 실제 객체에 접근하는 방식으로 동작한다.

속성값으로 기본형 타입을 가질 수도있고, 메소드를 가질 수도 있다는 것에 주의하자.

사용

console.log(userInfo.age);
userInfo.old();

'객체이름.속성'

위 형태로 속성값에 접근할 수 있다. 기본타입 속성을 직접적으로 접근하는 것보다 메소드에 의해서 접근하는 것이 캡슐화(Encapsulation)에 더 바람직할 수 있으니 직접 기본타입 속성에 접근하는 것은 신중히 하도록 하자.

만약에 속성값이 메소드의 형태라면 속성명 뒤에 소괄호(( ))를 붙여줘야하는 것을 잊지말자.

추가

userInfo.email = "hyoje420@daum.net";

속성을 추가하는 동작은 굉장히 심플하다.

'객체.새로운속성명 = 새로운속성값'

위와 같은 형태로 간단히 새로운 속성을 추가할 수 있다.

삭제

delete userInfo.age;

더이상 필요하지 않게된 속성은 delete명령어로 삭제할 수 있다. 속성값만 삭제하는 것이 아니라. 속성 자체를 메모리에서 삭제하여 완전히 삭제된다는 것만 주의하면 되겠다.

싱글톤 패턴(Singleton Pattern)

자바스크립트의 객체를 객체 리터럴로 선언하게 되면, 기본적으로 싱글톤 패턴으로 객체가 생성된다. 싱글톤 패턴이란 하나의 목적으로 생성된 객체는 반드시 하나만 생성되야 한다는 것이다.

하지만 속성값이 밖으로 보여지므로, 완벽하게 캡슐화는 되어있지 않다. 따라서 정확한 싱글톤 패턴의 객체를 선언하기 위해서는 코딩 방식이 필요한데, 이는 아직 이해가 부족하여 잘 정리된 페이지로 링크를 걸어 놓도록 하겠다.

https://www.zerocho.com/category/JavaScript/post/57541bef7dfff917002c4e86

자바스크립트 프로토타입

자바스크립트에는 클래스라는 개념이 존재하지 않는다. 단지 객체자체를 생성하고 사용하는 방법만 존재하므로 이전에 객체지향 언어를 공부했던 분들은 착오가 없기를 바란다.

따라서 클래스의 존재를 대신할 무언가가 프로토타입이라는 개념이다. 기존의 객체를 복사하여 새로운 객체를 생성하는 개념이다. 따라서 이 개념의 정확한 구현은 추후에 정확한 이해를 바탕으로 다시 정리해 보도록 하겠다.

참고

Head First JavaScript Programming - Eric Freeman and Elisabeth Robson

http://steadypost.net/post/lecture/id/13/

https://www.zerocho.com/category/JavaScript/post/57541bef7dfff917002c4e86

http://www.nextree.co.kr/p7323/