[JavaScript] Object

Object

Object 객체는 객체의 가장 기본적인 형태를 가지고 있는 객체이다. 다시 말해서 아무것도 상속받지 않는 순수한 객체다. 자바스크립트에서는 값을 저장하는 기본적인 단위로 Object를 사용한다. 

var grades = {'test1': 10, 'test2': 6, 'test3': 80};

동시에 자바스크립트의 모든 객체는 Object 객체를 상속 받는데, 그런 이유로 모든 객체는 Object 객체의 프로퍼티를 가지고 있다.

Object의 prototype은 모든 객체의 prototype이 된다.

Object가 가지고 있는 prototype는 모든 객체가 사용할 수 있는 기능이다. 즉, 모든 객체가 공통적으로 사용할 기능이 있다면 Object의 prototype으로 지정해 쓸 것이다. 

모든 객체가 가지고 있었으면 하는 기능이 있다면 개발자가 기능을 추가할 수 있다.

또한 Object 객체를 확장하면 모든 객체가 접근할 수 있는 API를 만들 수 있다. 아래는 Object 객체를 확장한 사례다.

- Object.메소드() 와 Object.prototype.메소드()의 차이

Object.keys(arr); --> Object.keys=function(){ }

Object.protptype.toString() --> Object.prototype.toString = function(){ }

메소드가 프로토타입 소속이라는 것은 new한 순간 객체를 만들고 그 객체는 포로토타입이라는 특수한 프로퍼티에에 저장된 객체를 원형으로 하는 객체가 생성된다.

그렇게 생성된 객체는 toString()을 사용할 수 있게 된다.

Object는 자바스크립트의 공통 조상이다. 그래서 Object중에 ptototype이 중간에 낀 메소드들은 모든 객체들이 상속받고 있는 공통의 기능이 된다.

개발자가 만드는 자바스크립트 웹어플리케이션에서 모든 객체들이 공통적으로 가지고 있어야 하는 기능이 있다면 Object의 prototype 객체를 수정하여 그러한 기능을 만들 수 있다.

Object.prototype.contain = function(needle) {//어떠한 메소드를 갖게 하고 싶다면  

    for(var name in this){//메소드가 소속되어 있는 객체 -->this

        if(this[name] === needle){// 객체들은 for-in문을 사용하여 하나하나 꺼내서 볼 수 있다.

            return true;

        }

    }

    return false;

}

var o = {'name':'test1', 'city':'test2'}

console.log(o.contain('test1'));//contain은 value가 존재하는지 체크-->true or false

var a = ['test1','test2','test3'];

console.log(a.contain('test2'));

그런데 Object 객체는 확장하지 않는 것이 바람직하다. 왜냐하면 모든 객체에 영향을 주기 때문이다. 

확장 후에 아래 코드를 실행해보자.

for(var name in o){

    console.log(name);  

}

결과)

name

city

contain

--> prototype의 메소드인 contain까지 포함되는 결과를 낳게 된다.(원래 var o = {'name':'test1', 'city':'Seoul'})

확장한 프로퍼티인 contain이 포함되어 있다. 객체가 기본적으로 가지고 있을 것으로 예상하고 있는 객체 외에 다른 객체를 가지고 있는 것은 개발자들에게 혼란을 준다. 

이 문제를 회피하기 위해서는 프로퍼티의 해당 객체의 소속인지를 체크해볼 수 있는 hasOwnProperty를 사용하면 된다. 

for(var name in o){

    if(o.hasOwnProperty(name))

        console.log(name);  

}

결과)

name

city

hasOwnProperty는 인자로 전달된 속성의 이름이 객체의 속성인지 여부를 판단한다. 만약 prototype으로 상속 받은 객체라면 false(contain은 부모로부터 상속받은 프로퍼티이다.)가 된다. 

--> 객체의 직접적인 소유인 체크

출처: https://devbox.tistory.com/entry/JavaScript-Object?category=574556 [장인개발자를 꿈꾸는 :: 기록하는 공간]