Node.js.42.JavaScript-객체-데이터와 처리 방법을 담는 그릇으로서 객체

목표

객체에 함수를 담으면 이름으로 함수를 불러올 수 있기 때문에, 객체에 함수를 담는 용도로 많이 사용한다.

그렇다면 객체에 함수를 담으면 무엇을 할 수 있고 어떤 장점이 있는지 알아보자.

 

---

만약 1억줄의 코드가 있다고 생각해보자. 수많은 변수 중  아래 두 변수가 있다고 생각해보자.

var v1 = 'v1';
// 10,000 codes
v1 = 'egoing';
var v2 = 'v2';

코드가 많으므로 v1값은 이전 값에서 새로운 값으로 덮어질 것이다. 이런 상황에서 객체를 사용하면 도움이 된다.

var o = {
  v1: 'v1',
  v2: 'v2',
};

이처럼 하나의 객체 안에 정리정돈하여 변수를 넣어놓는 것이다. 하나의 폴더를 만들어 정리정돈하는 것으로 생각하면 된다.

 

---

//v1을 처리하는 함수
function f1(){
  console.log(o.v1);
}

//v2를 처리하는 함수
function f2(){
  console.log(o.v2);
}

f1(); //v1
f2(); //v2

현재 f1(), f2()함수가 있다. 이때 신입 엔지니어가 1억개의 코드 중에서 f1()함수를 자신의 필요에 의해 만들었다고 생각해보자. 그러면 이전에 만든 f()이 삭제된다.

이런 경우 도움이 되는 것이 객체라 했다 !

자바스크립트에서는 자바가 값이다 라고 하는 특성을 이용하면, 이 함수가 사용하는 데이터들이 그룹핑되어 있는 객체에 멤버로써 추가할 수 있다.

var o = {
  v1: 'v1',
  v2: 'v2',
  f1: function (){
    console.log(o.v1);
  },
  function f2(){
    console.log(o.v2);
  }
};

o.f1(); //v1
o.f2(); //v2

하나의 객체 o 안에, 서로 연관된 값들과 그 값을 처리하는 함수들이 그룹핑되어 있기 때문에 이는 아주 정리가 잘 된 코드가 된다.

하지만 하나 우스운 점이 있다. f1(), f2() 함수 안에 있는 코드가 어떤 이름의 변수에 할당될 것인지를 함수가 알고 있어야 하기 때문이다. 만일 var o->p로 변경하게 되면 함수 f1(), f2()는 실행되지 않는다. 이제 o라는 객체는 존재하지 않기 떄문이다.

그래서 함수가 객체 안에서 사용될 때, 자신이 속한 객체를 참조할 수 있도록 특수한 약속을 만들었다. 키워드 this이다.

var o = {
  v1: 'v1',
  v2: 'v2',
  f1: function (){
    console.log(this.v1);
  },
  function f2(){
    console.log(this.v2);
  }
};

o.f1(); //v1
o.f2(); //v2

우리는 이제 우리는 언제나 함수 내에서 this라는 약속된 값을 통해 함수가 속해있는 객체를 참조할 수 있게 된다.

 

---

요약

함수는 값이다.

객체는 값을 저장하는 그릇이다.

이 두 사실을 이용하여, 서로 연관된 데이터와 처리방법을 담은 함수들을 객체를 이용하여 그룹핑하는 것을 통해 코드의 복잡성을 획기적으로 낮출 수 있다.