JavaScript에서 속성이 존재하는지 확인하기

JavaScript 객체에 속성이 있는지 확인할 때는 작업에서 말하는 ‘존재’가 무엇인지에 맞춰 검사 방법을 선택하세요. Object.prototype.hasOwnProperty()는 객체에 직접 저장된 속성만 확인합니다. in 연산자는 이러한 고유 속성과 프로토타입 체인을 통해 상속된 속성을 모두 확인합니다.

JavaScript 객체에 속성이 있는지 확인하기

객체 자체가 키를 정의하는지 확인하려면 Object.prototype.hasOwnProperty()를 사용하세요. 이 메서드는 값과 관계없이 키가 있는지를 기준으로 불리언을 반환합니다. 따라서 값이 null 또는 undefined인 고유 속성도 존재하는 것으로 확인됩니다. Object.prototype.hasOwnProperty.call(object, key) 형식은 객체에 hasOwnProperty라는 고유 속성이 있는 경우에도 사용할 수 있어 안전합니다. 키에는 문자열이나 심볼을 사용할 수 있습니다. 이 메서드로 배열에 특정 인덱스가 고유 속성으로 있는지도 확인할 수 있습니다. hasOwnProperty()에 관한 MDN 문서를 참고하세요.

속성의 존재 여부와 값 확인은 별개의 문제입니다. 속성이 있지만 값이 undefined라면 고유 속성 검사는 여전히 true를 반환합니다. 값 비교는 다른 질문에 답합니다. 마찬가지로 in은 프로토타입에서 상속된 키에도 true를 반환할 수 있지만, 그 키를 읽는 것만으로는 어디에 정의되었는지 알 수 없습니다. 코드에 객체 자체의 키가 필요한지, 접근 가능한 키라면 충분한지에 맞춰 검사 방법을 선택하세요.

상속된 속성도 포함하려면 key in object를 사용하세요. 이것은 메서드 호출이 아니라 연산자 표현식입니다. 왼쪽 피연산자는 속성 키이고 오른쪽 피연산자는 객체입니다. 배열에 사용하면 인덱스뿐 아니라 배열의 프로토타입 체인도 확인합니다. in 연산자에 관한 MDN 문서를 참고하세요.

다음 독립 실행 예제를 실행해 보세요:

const defaults = { theme: 'light' };
const settings = Object.create(defaults);
settings.language = 'en';

console.log(Object.prototype.hasOwnProperty.call(settings, 'language'));
console.log(Object.prototype.hasOwnProperty.call(settings, 'theme'));
console.log('theme' in settings);
console.log('timezone' in settings);

if (!Object.prototype.hasOwnProperty.call(settings, 'timezone')) {
  settings.timezone = 'UTC';
}
console.log(settings.timezone);

true
false
true
false
UTC

여기서 language는 고유 속성이고 theme은 defaults에서 상속된 속성입니다. 고유 속성 검사는 두 속성을 구분하지만 in은 둘 다 인식합니다. 없는 timezone을 확인할 때는 검사를 부정하므로, 객체에 해당 속성이 아직 정의되어 있지 않은 경우에만 예제에서 이를 추가합니다. 상속된 키가 있어도 추가를 막으려면 !('key' in object) 패턴을 사용하세요. 제공된 실행 결과는 true, false, true, false, UTC 순서로 출력됩니다.