[Javascript] 객체에 특정 속성이 존재하는지 체크하는 3가지 방법

 

Javascript의 객체에 특정 속성이 존재하는지 체크하는 방법 3가지를 소개합니다.

 

 

1. hasOwnProperty() 함수

const person = {
  name : 'alice',
  country: 'korea'
}

const haveName = person.hasOwnProperty('name');
const haveAge = person.hasOwnProperty('age');

document.writeln(haveName);
document.writeln(haveAge);

 

 

hasOwnProperty 함수는 파라미터로 전달된 property(속성)가 객체에 존재하면 true를 리턴하고,

그렇지 않으면 false를 리턴합니다.

 

 

 

2. in 연산자 사용하기

const person = {
  name : 'alice',
  country: 'korea'
}

const haveName = 'name' in person;
const haveAge = 'age' in person;

document.writeln(haveName);
document.writeln(haveAge);

in 연산자도 hasOwnProperty 함수와 비슷하게 객체에 프로퍼티가 있으면 true를 리턴하고, 

그렇지 않으면 false를 리턴합니다.

 

 

그렇다면,

hasOwnProperty() 함수와 in 연산자의 차이는 무엇일까요?

hasOwnProperty() vs in 연산자 차이

const person = {
  name : 'alice',
  country: 'korea'
}

const hasOwnPropertyTest = person.hasOwnProperty('toString');
const inTest = 'toString' in person;

document.writeln(hasOwnPropertyTest);
document.writeln(inTest);

toString 메소드는 모든 객체가 공통적으로 가지는 속성입니다.

hasOwnProperty 메소드는, 이렇게 객체로부터 상속받은 속성을 체크하면 false를 리턴합니다.

in 연산자의 경우에는, toString과 같이 객체로부터 상속받은 속성을 체크하면 true를 리턴합니다.

 

 

 

3. undefined와 비교하기

const person = {
  name : 'alice',
  country: 'korea'
}

const haveName = person.name !== undefined;
const haveAge = person.age !== undefined;

document.writeln(haveName);
document.writeln(haveAge);

'person.age'와 같이, 객체에 존재하지 않는 속성(property)에 접근하면 undefined가 리턴됩니다.

이런 특징을 이용해서, 객체에 특정 속성이 존재하는지 여부를 체크할 수 있습니다.

 

주의할 점

const person = {
  name : 'alice',
  country: 'korea',
  age: undefined
}

const haveAge = person.age !== undefined;

document.writeln(haveAge);

위 예제의 경우, person 객체에 age 속성이 존재하지만, 그 값이 undefined로 정의되어 있습니다.

이 경우, person.age를 undefined 값과 비교하면 true를 리턴합니다.

따라서, 이 경우에는 원하는 결과와 다른 값을 얻게 됩니다.

실제로 속성이 존재하지만, 속성값이 undefined이기 때문에, 

위 코드에서는 마치 age 속성이 존재하지 않는 것과 같은 결과를 얻게됩니다.

 

---

 

객체에 특정 속성이 존재하는지 여부를 체크하는 방법 3가지를 알아보았습니다.

 

 정리 

1. hasOwnProperty() 함수

 - toString과 같은 객체로부터 상속받은 속성은 체크되지 않습니다.

 

2. in 연산자 사용하기

 - toString과 같은 객체로부터 상속받은 속성까지 모두 체크됩니다.

 

3. undefined와 비교하기

 - 속성 값이 undefined인 경우, 속성이 존재하지 않는 것처럼 체크됩니다.