본문 바로가기
Language/JavaScript

[JavaScript] obj.hasOwnProperty() - 객체가 특정 프로퍼티를 가지고 있는지 확인하기 (ft. Object.prototype.hasOwnProperty())

by 썸머워즈 2021. 8. 18.
반응형

객체가 특정 키를 가지고 있는지 확인하는 Object.prototype.hasOwnProperty() 메서드에 대해 알아보자.

 

▷ 구문

obj.hasOwnProperty(prop)

prop: 확인 하고자 하는 프로퍼티 명


예제를 통해 접근해보자.

 

▷ 예제1) Object.prototype.hasOwnProperty()

var obj = {};
obj.mine = 42;

console.log(obj.hasOwnProperty('mine'));
// true

console.log(obj.hasOwnProperty('it'));
// false

 

예제에서 보는것 처럼 해당 객체의 프로퍼티의 존재 유무를 판단하는 것이다, 프로퍼티의 값이 무엇이든 프로퍼티가 존재하기만 하면 true를 반환하고 존재하지 않을경우 false를 반환한다.

 

사실 이쯤되면 생각하는게 도대체 이걸 왜쓸까...? 일것이다.

굳이 hasOwnProperty() 메서드를 사용하지 않아도 특정 키값이 있는지 없는지 정도는 확인이 가능하기 때문이다.

 

우선 첫번째 이유는 아무래도 코드의 가독성 향상이다.

hasOwnProperty() 메서드는 메서드명에서부터 모르는 사람이 보더라도 이게 무슨 기능을 하는지 알 수 있다.

 

▷ 예제2) hasOwnProperty()를 사용하고 안하고의 차이

var obj = {};
obj.mine = 42;

//hasOwnProperty() 사용
if(obj.hasOwnProperty('mine')){
	...
}

//hasOenProperty() 미사용
if(obj.mine != undefined){
	...
}

 

그리고 두번째 이유는 프로토타입 체인 문제 때문이다.

스크립트에는 프로토타입이 존재하는데 객체에 프로토타입 체인을 통해 추가적으로 프로퍼티를 삽입할 수 있다.

 

흔히들 인터넷에 hasOwnProperty() 메서드를 검색해보면 for ~ in 객체 반복문과 같이 나오는데

for ~ in 문법은 열거가능한 프로퍼티를 반복하기 때문에 프로토타입 체인으로 추가한 프로퍼티 역시 반복 대상이다.

 

예제를 통해 자세히 알아보자.

 

▷ 예제3) for ~ in 문법과 hasOwnProperty() 메서드

var obj = {};
obj.mine = 42;
Object.prototype.toRecord = function() {
	console.log('hi')
};

obj.mine // 42
obj.toRecord // f() {console.log('hi')}

for(mine in obj){
	console.log('obj property : ' + mine); 
	console.log('hasOwnProperty : ' + obj.hasOwnProperty(mine));
}

 

이런식으로 프로토타입 체인을 통해 추가한 프로퍼티에 대해 hasOwnProperty()는 어떻게 반응할까?

 

▷ 결과

obj property : mine
hasOwnProperty : true
obj property : toRecord
hasOwnProperty : false

 

이런식으로 프로토타입 체인을 사용하게 되면 직접적으로 obj.toRecord 라고 선언해도 접근이 되며, for ~ in 문법에서도 접근하게 된다.

그래서 이러한 프로토타입 체인을 통해 생성된 프로퍼티에 대해 접근하지 않으려 hasOwnProperty() 메서드를 사용하는 것이다.


위에 저렇게 설명을 해도 일반적인 상황에서는 굳이 사용할 필요는 없다.

단지 예상하지 못한 에러 방지나 가독성 향상을 위해서 사용해주면 좋을것 같다.

 

참고 : https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Global_Objects/Object/hasOwnProperty

 

Object.prototype.hasOwnProperty() - JavaScript | MDN

hasOwnProperty() 메소드는 객체가 특정 프로퍼티를 가지고 있는지를  나타내는 불리언 값을 반환한다.

developer.mozilla.org

 

반응형


댓글

TOP